Autofocus ne fonctionne pas pour le champ de saisie

Quand je Presse le bouton de Connexion un popup s'affiche.

Dans cette popup j'ai besoin de défaut de l'autofocus sur Login champ de Saisie. Puis-je réaliser qu'avec HTML5/CSS?

jsfiddle

<div class="main">
    <div class="panel"> <a href="#login_form" id="login_pop" onclick="">Log In</a>

    </div>
</div>
<!-- popup form #1 --> <a href="#x" class="overlay" id="login_form"></a>

<div class="popup">
     <h2>Welcome Guest!</h2>

    <p>Please enter your login and password here</p>
    <div>
        <label for="login">Login</label>
        <input type="text" id="login" value="" autofocus />
    </div>
    <div>
        <label for="password">Password</label>
        <input type="password" id="password" value="" />
    </div>
    <input type="button" value="Log In" /> <a class="close" href="#close"></a>

</div>
où est le violon ?
veuillez ajouter le code de stackoverflow, et pas seulement dans un violon.
essayé de javascript? de l'élément.focus() et de l'élément.sélectionnez()?
S'il vous plaît arrêter la suppression des modifications au lieu de les améliorer, puisque vous semblez ne pas faire ce que vous demande et également de coller le code de la tripoter

OriginalL'auteur raghava goud | 2014-12-05

  1. 1

    La Réponse n'est pas vraiment efficace (avec certitude).

    Je suggère de Javascript, comme UnskilledFreak mentionné, chaque fois que vous cliquez, l'accent est mis

    ...    
<a href="#login_form" id="login_pop" onmouseup="document.getElementById('login').select();">Log In</a>
...
<!-- not javascript library needed -->
<!-- tested on Win7 and Chrome 37+ -->

    Voici votre violon mise à jour: http://jsfiddle.net/6f9ge64f/2/

    Vous devriez également vérifier la clé d'entrée pour les personnes qui n'utilisent pas de souris.

    Mise à jour:

    c'est très orthodoxe, mais vous pouvez essayer de

    ...    
<a href="PATH-TO-FILE?c=1#login_form" id="login_pop" onmouseup="document.getElementById('login').select();">Log In</a>
...
<input type="text" id="login" value="" autofocus />
...
<a class="close" href="PATH-TO-FILE?c=2#close"></a>
...
<!-- tested with on Win7 and Chrome 37+ -->

    où la PATH-TO-FILE est par exemple http://www.test.com/default.html (absolue ou relative), et le ?c=1 et ?c=2 est un paramètre, juste pour provoquer un rechargement. comme cela, vous pourriez utiliser autofocus.

    CELA ne marchera pas DANS JSFIDDLE depuis le HTML est intégré, mais il fonctionne dans le "monde réel".

    Mise à jour 2:

    ...
<a href="#login_form" id="login_pop" onmouseup="setTimeout(function(){document.getElementById('login').focus()},10);">Log In</a>
<!-- tested with on Win7 and Chrome 37+ -->
...

    Ici est le violon http://jsfiddle.net/6f9ge64f/6/

    Désolé, ça ne fonctionne pas..
    Ce qui n'a pas de travail? la première partie ou la hacky Version?
    Première Partie @Winner_joiner
    j'ai juste essayé de nouveau, dans jsfiddle. je ne vois pas le curseur, mais quand je commence à taper, il fonctionne. Quel navigateur utilisez-vous?
    Oui @Winner_joiner. J'ai besoin d'autofocus sur ce champ de Connexion.Je suis en utilisant Google Chrome

    OriginalL'auteur winner_joiner

  2. 25

    autofocus est défini à travailler de manière fiable uniquement au chargement de la page. Il n'est pas vraiment adapté pour les situations où vous échangez, ou l'ouverture, ou de révéler des éléments du DOM comme dans une page unique cadre d'application. Vous êtes susceptible d'avoir à recourir à la manipulation de la mise au point automatique vous-même.

    OriginalL'auteur

  3. 3

    Attribut Autofocus déplace le focus vers l'entrée spécifié au chargement de la page. Dans ce cas #entrée est présent dans les DOM, mais caché; en cliquant sur "connexion", l'accent est supprimé.

    Devriez probablement utiliser .focus() sur la connexion, cliquez sur gestionnaire d'événement

     <input type="text" id="login" value=""  />
 <input type="text" id="login" value="" autofocus />
 <input type="text" id="login" value=""  />

    http://jsfiddle.net/6f9ge64f/4/

    Mais pour mon violon, il n'est pas de travail @Prabhu Surya

    OriginalL'auteur Prabhu Suriya

  4. -1

    Si vous utilisez jQuery faire quelque chose comme ceci:

    $( "#login-button" ).click(function() {
    $( "#input" ).focus();
});
    Mais pour mon violon, il ne fonctionne pas
    Vous n'êtes probablement pas à l'aide de jQuery.

    OriginalL'auteur Klevis Miho