Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

lifenetwork

Input

Por , em Desenvolvimento frontend

Recommended Posts

lifenetwork    0

lifenetwork
Postado

Ola

 

 

Tenho uma tela que fiz para rodar no celular onde tenho tenho 3 caixa para o cliente digitar

 

Nome

 

Email

 

Senha

 

 

---- Quando eu carrego ela no celular ela vem bacana porem se eu preencher o campo nome e clicar no campo senha ele nao deixa me joga para o campo nome novamente e o celular colocar um setinha onde clicando ele vai passando de campo em campo como se fosse um botao TAB.. gostaria que o cliente pudesse clicar nos campos que ele quiser por que se ele errar ele volta la em cima, ele nao consegue largar nenhum campo em branco

Compartilhar este post

Link para o post
Compartilhar em outros sites

lifenetwork    0

lifenetwork
Postado

Então

 

A reclamação dos clientes foi o que eu disse ele entra na tela e tem 3 campos com IOS quando você preenche o primeiro campo aparece uma seta > ja no android so passa para o próximo campo clicando no botão IR no teclado.. os clientes querem ter a comodidade de clicar em qual campo quiser... se ele tentar colocar o ultimo campo ele é redirecionado para o primeiro. segue o HTML.

 

OBS : Estou aprendendo agora sobre html5 então vocês irão ver erros mas quero aprender...

 

 

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/estilo2.css" />
    <link rel="shortcut icon" href="favicon.ico">
    <title>Connect HotSpot</title>
   <link rel="stylesheet" href="css/bg.css">
  
</head>
<form method="post" action="[url=http://192.168.0.10/redirect_cad.php]http://192.168.0.10/redirect_cad.php[/url]" onSubmit="return ( verifica() )" name="frmEnvia">
<div id="formulario">
<fieldset id="login">
    <div id="logo">
    <img src="imagem/logo.jpg" id="img-logo-cabecalho"/>
        </div>
        <label>
            <span class="auto-style2">Usuário</span>
            <input id="nome" type="text" required="required" placeholder="Digite seu usuário" name="login" />
            </input>
            <span class="auto-style2">E-mail</span>
            <input id="email" type="email" required="required" name="email" placeholder="Digite seu e-mail" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" />
            </input>
            <span>Senha</span>
             <input id="senha" type="password" required="nome" name="senha" id="senha" placeholder="Digite sua senha" />
            <div id="botao-acessar">
            <button>Cadastrar</button>
             </div>
                </input>
             </label>
            <div id="rodape">
            <p> Quer ter um HotSpot no seu estabelecimento ?</p>
            <p>Ligue agora : </p>
            <p>www.lifenetwork.com.br</p>
            </div>
        </fieldset>
 
    </div>
        </form>
    
</div>
</div>
 
</body>
</html>

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

vc tá fazendo um uso errado da tag label

 

cada input deve ter o seu próprio label

 

o seu erro é q vc colocou todos dentro do mesmo

Compartilhar este post

Link para o post
Compartilhar em outros sites

Diego - Oliveira    2

Diego - Oliveira
Postado

Como o William Bruno falou, cada input deve ter seu próprio label.

ex:

<label for="nome">Nome</label>

<input type="text" id="nome" name="login" />

não esquecendo que o for da tag label vai ligar ao ID do input

Compartilhar este post

Link para o post
Compartilhar em outros sites

Martyns    3

Martyns
Postado

seu <label>, além de estar no lugar errado como os colegas acima falaram, ele é inútil aí, já que não tem um FOR

 

O label, serve para redirecionar o FOCUS à algum elemento quando tocar(clicar) nele:

<label for="input1">Clicar aqui, dá foco na input abaixo: </label>
<input type="text" id="input1" />

portanto, clicar em qualquer elemento que está dentro dele fará que você volte ao primeiro input

 

remova seu label e use um para cada input. use o atributo FOR do label, para referir a ID da input à qual ele se refere

Compartilhar este post

Link para o post
Compartilhar em outros sites

gpontes    9

gpontes
Postado

Você também pode fazer assim, funciona do mesmo jeito e não é errado!

<label>
  <span>Meu label!</span>
  <input type="text" name="label" />
</label>

seu <label>, além de estar no lugar errado como os colegas acima falaram, ele é inútil aí, já que não tem um FOR

 

O label, serve para redirecionar o FOCUS à algum elemento quando tocar(clicar) nele:

<label for="input1">Clicar aqui, dá foco na input abaixo: </label>
<input type="text" id="input1" />

portanto, clicar em qualquer elemento que está dentro dele fará que você volte ao primeiro input

 

remova seu label e use um para cada input. use o atributo FOR do label, para referir a ID da input à qual ele se refere

Compartilhar este post

Link para o post
Compartilhar em outros sites

Martyns    3

Martyns
Postado

 

Você também pode fazer assim, funciona do mesmo jeito e não é errado!

<label>
  <span>Meu label!</span>
  <input type="text" name="label" />
</label>

É mesmo, mas você pode ter apenas uma input dentro dessa label, o que não acontece no exemplo do lifenetwork

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito