Je crée un formulaire d'enquête qui doit avoir chaque question et définir des réponses en surbrillance (en modifiant la couleur de fond) lorsque l'utilisateur se concentre sur eux. .focus () et .blur () les deux travaillent dans Firefox et c'est-à-dire, mais <li>
<label for="webmail" class="desc">Email</label>
<input type="text" name="webmail" id="webmail" />
</li>
<li>
<label for="business" class="desc">Purpose of your Charter Flight:</label>
<div>
<span>
<input type="radio" name="purpose" id="business" class="radio" />
<label class="choice" for="business">Business</label>
</span>
<span>
<input type="radio" name="purpose" id="pleasure" class="radio" />
<label class="choice" for="pleasure">Pleasure</label>
</span>
</div>
</li>
3 Réponses :
Je suis également tombé sur ce problème il y a longtemps et curieusement, c'était un bouton radio me donnant le chagrin.
Essayez d'utiliser au cas où il n'est pas clair de mon utilisation folle de noms d'identifiant, jquery.change () à la place, voici un Exemple de travail de ce problème que j'avais entrée # Zendesk-Dropbox-Demandé avant & < code> entrée # zendesk-dropbox-newhere sont les deux boutons radio.
Merci pour l'aide, mais j'ai fini par le comprendre seul. Ceci est définitivement bon de savoir cependant pour sélectionner, radios et cases à cocher. Il a une utilisation limitée pour les champs de texte et Texareas car l'événement déclenche une fois que vous quittez la mise au point sur le terrain, ce qui n'est pas exactement ce que je cherchais, mais cela aurait certainement pu être utilisé pour brute force les boutons radio et les cases à cocher pour travailler en chrome /Safari
J'ai rencontré le même problème, les entrées de texte et les entrées de radio avaient eu l'événement "Focus", mais la radio n'a pas tiré cet événement en webkit, il a donc été mis sur l'événement "Changement". Maintenant, j'ai deux événements, "Focus" pour les entrées de texte et "changement" pour la radio, les deux appelent le même rappel.
J'y ai pensé sur le lecteur à la maison la nuit dernière et la figurant seul, ce n'est peut-être pas la solution la plus élégante, mais cela fonctionne certainement.
$(document).ready(function()
{
$("textarea, input, select, .radio, .checkbox").click(function()
{
$("form li.over").toggleClass("over");
$(this).parents("li").toggleClass("over");
});
});
Vous devez également inclure l'événement de clic pertinent sur l'étiquette des valeurs d'entrée et que se passe-t-il lorsque les utilisateurs utilisent l'onglet pour naviguer dans votre formulaire?
Souhaitez-vous clarifier ce que vous entendez par événement de clic pertinent? Voulez-vous dire ajouter l'attribut OnClick à l'étiquette? Aussi, pourquoi? Je suis assez nouveau dans toute la chose javascript tout autour, alors toute aide est utile! Je l'aimerais si .blur () et .Focus () fonctionnait correctement sur la souris cliquez sur WebKit, mais le client voulait qu'il fonctionne lorsqu'il a cliqué dessus. Connaissez-vous un moyen élégant d'ajouter la fonctionnalité .Focus () et .blur () sans répéter le code une seconde fois avec ces manutentionnaires d'événements?
Comme @jakealisonline a souligné, vous aurez des problèmes lorsque l'utilisateur utilise l'onglet ou clique sur l'étiquette, deux méthodes standard de naviguer dans un formulaire. Je suggère de laisser l'événement de mise au point sur les entrées de texte et de l'ajout d'un événement de changement aux radios et à des cases à cocher comme je le suggère comme un commentaire dans l'autre réponse.
// In js area write following method
$('#chkRikin').focus(function() {
alert('Say Hi Rikin');
});
// in html area write following code anenter code hered test it your self
<input type="checkbox" onclick="this.focus()" onblur="yourMethod()" />
it works in google crom
Si
flou () ne fonctionne pas, essayez de créer un élément d'entrée factice, de le coller quelque part sur la page et d'appelerfocus () dessus.