Détecter quelle entrée de formulaire se concentre en utilisant JavaScript ou jQuery

comment détectez-vous quelle entrée de formulaire a focus en utilisant JavaScript ou jQuery?

à partir d'une fonction je veux être capable de déterminer quelle forme input a focus. J'aimerais pouvoir le faire en JavaScript et/ou jQuery.

30
demandé sur hippietrail 2008-12-10 03:21:07

9 réponses

je ne suis pas sûr si ce est la façon la plus efficace, mais vous pourriez essayer:

var selectedInput = null;
$(function() {
    $('input, textarea, select').focus(function() {
        selectedInput = this;
    }).blur(function(){
        selectedInput = null;
    });
});
16
répondu Paolo Bergantino 2012-09-06 03:41:52

document.activeElement, il est pris en charge dans IE depuis longtemps et les dernières versions de FF et chrome le prennent également en charge. Si rien n'a le focus, il renvoie l' document.body objet.

59
répondu Juan Mendes 2012-05-09 15:10:29

si tout ce que vous voulez faire est de changer le CSS pour un champ de formulaire particulier quand il se focalise, vous pouvez utiliser le sélecteur CSS ":focus". Pour la compatibilité avec IE6 qui ne supporte pas cela, vous pouvez utiliser le IE7 bibliothèque.

3
répondu Marc Novakowski 2008-12-10 00:49:49

sinon, vous pouvez utiliser les évènements onfocus et onblur.

quelque chose comme:

<input type="text" onfocus="txtfocus=1" onblur="txtfocus=0" />

et puis avoir quelque chose comme ça dans votre javascript

if (txtfocus==1)
{
//Whatever code you want to run
}

if (txtfocus==0)
{
//Something else here
}

Mais ce serait juste ma façon de faire, et il pourrait ne pas être très pratique si vous avez, disons de 10 entrées :)

1
répondu Maxime Kjaer 2011-08-30 16:55:09

je le ferais de cette façon: j'ai utilisé une fonction qui renverrait un 1 si L'ID de l'élément qu'il a été envoyé était un qui déclencherait mon événement, et tous les autres renverraient un 0, et l'instruction "si" tomberait alors à travers et ne ferait rien:

function getSender(field) {
    switch (field.id) {
        case "someID":
        case "someOtherID":
            return 1;
        break;
        default:
            return 0;
    }
}

function doSomething(elem) {
    if (getSender(elem) == 1) {
       // do your stuff
    }
  /*  else {
       // do something else
    }  */
}

HTML Markup:

<input id="someID" onfocus="doSomething(this)" />
<input id="someOtherID" onfocus="doSomething(this)" />
<input id="someOtherGodForsakenID" onfocus="doSomething(this)" />

les deux premiers feront l'événement dans doSomething, le dernier ne le fera pas (ou fera la clause else s'il n'est pas implémenté).