A linguagem HTML versão 5 traz um conjunto de novos atributo...

Próximas questões
Com base no mesmo assunto
Ano: 2013 Banca: FCC Órgão: DPE-SP Prova: FCC - 2013 - DPE-SP - Programador de computador |
Q304592 Programação
A linguagem HTML versão 5 traz um conjunto de novos atributos e tipos de dados para campos de formulário. Uma das grandes vantagens de alguns desses atributos é que dispensam o uso de JavaScript para validar a entrada de diversos tipos de dados e formatos nos campos, facilitando o trabalho do desenvolvedor.

Baseado nessas informações, analise o fragmento de código a seguir:

<.p>
    <.label>
           Telefone: <.input type=" ..I.... " .I...I.. ="^\(?\d{2}\)\d{4}[-\s]\d{4}.*?$" placeholder="(XX)XXXX-XXXX" name="telefone">
     <./label>
 <./p>


Considere que o bloco de código apresentado objetiva permitir a entrada de um tipo telefone no formato indicado pela expressão regular "^\(?\d{2}\)\d{4}[-\s]\d{4}.*?$".
Para isso, as lacunas I e II devem ser preenchidas correta e, respectivamente, com
Alternativas

Gabarito comentado

Confira o gabarito comentado por um dos nossos professores

A alternativa correta é a B - <tel - pattern>.

O HTML5 trouxe diversas melhorias em relação às versões anteriores, particularmente com a introdução de novos tipos de dados e atributos para formulários que permitem validar a entrada de dados sem precisar utilizar JavaScript. Estes avanços simplificam o trabalho dos desenvolvedores ao prover validação nativa e mais segura dos dados inseridos pelos usuários.

No caso específico do fragmento de código apresentado na questão, pretende-se criar um campo de formulário para a entrada de números de telefone com uma validação específica de formato, usando uma expressão regular. A expressão regular fornecida é: ^\(?\d{2}\)\d{4}[-\s]\d{4}.*?$, que valida um padrão de telefone com dois dígitos de DDD entre parênteses (opcionais), seguidos por quatro dígitos, um hífen ou espaço, e mais quatro dígitos.

O atributo <type> define o tipo de dado que o campo irá receber, e o <pattern> permite especificar uma expressão regular à qual o valor do campo deve corresponder para ser considerado válido. O valor <tel> para o atributo <type> indica que o campo é destinado para a entrada de números de telefone. O atributo <pattern> é utilizado para inserir a expressão regular que valida o formato do telefone de acordo com o padrão desejado.

As demais alternativas estão incorretas porque não utilizam os atributos apropriados para definir o tipo de campo e o padrão de validação necessários. O tipo <phone> não existe em HTML5, e <mask> e <alt> não são atributos usados para validar a entrada em campos de formulário. O tipo <text> pode ser usado para entrada de texto genérico, mas não fornece validação específica para telefones, e <number> é destinado para a inserção de números, mas não adequado para formatos de telefone com parênteses, hifens e espaços.

Portanto, a alternativa B é a única que preenche corretamente as lacunas, especificando um campo de entrada para telefones com uma expressão regular como padrão de validação.

Clique para visualizar este gabarito

Visualize o gabarito desta questão clicando no botão abaixo

Comentários

Veja os comentários dos nossos alunos

Novos valores para o atributo type: (pág 33)
tel
search
email
url
Datas e horas
number
range
color
pattern (pág 39)
O atributo pattern nos permite definir expressões regulares de validação, sem Javascript
Fonte: http://www.w3c.br/pub/Cursos/CursoHTML5/html5-web.pdf

http://www.w3schools.com/html/html5_new_elements.asp

A charada da questão é saber o conceito do novo atributo de input "pattern" que está em : "Uma das grandes vantagens de alguns desses atributos é que dispensam o uso de JavaScript para validar a entrada de diversos tipos de dados e formatos nos campos"

Vejam essa questão :

TRE-PE/2011/FCC/An. Judiciário/53

Na HTML5, o atributo do elemento <input> que especifica uma expressão regular Javascript para validar a entrada de dados em um campo texto é o

a) masked.

b) expression.

c) override.

d) placeholder.

e) pattern


GAB B

Input Types

You know all about web forms, right? Make a

, add a few elements and maybe na , and finish it off with an button.

You don’t know the half of it. HTML5 defines over a dozen new input types that you can use in your forms:

input type=”search”

For search boxes

input type=”number”

For spinboxes

input type=”range”

For sliders

input type=”color”

For color pickers

input type=”tel”

For telephone numbers

input type=”url”

For web addresses

input type=”email”

For email addresses

input type=”date”

For calendar date pickers

input type=”month”

For months

input type=”week”

For weeks

input type=”time”

For timestamps

input type=”datetime”

For precise, absolute date/timestamps

input type=”datetime-local”

For local dates and times

PILGRIM, Mark. HTML5: Up and Running. O'Reilly | Google Press, 2010, p. 25 e 26.

Apesar desse não ser o principal tema da questão (sobre atributos da tag input), gostaria de comentar que a expressão regular criada é uma porcaria.

De acordo com essa expressão regular para número de telefone com DDD de 2 dígitos seguido de 2 quartetos, a abertura de parêntesis ( é opcional, mas o fechamento ) não.
Então, a regex dá match em 12)3456-7890 . Note como fica estranho sem o (...

Clique para visualizar este comentário

Visualize os comentários desta questão clicando no botão abaixo