Comment (en utilisant javascript ou jQuery) puis-je détecter quand une valeur a été sélectionnée dans une zone de sélection, même si c'est la même option que précédemment (c.-à-d. Principalement, j'ai besoin de cela pour l'interaction avec la souris, mais une solution qui fonctionne pour le clavier serait également utile.Détection de l'interaction avec la zone de sélection
Répondre
La seule solution que je trouve réalisable est de provoquer change
événement en définissant la valeur de select
à un autre sur mousedown
. Dans le balisage, j'ai créé une option supplémentaire (c'est-à-dire le premier enfant) et l'ai cachée (se cache parfaitement dans Chrome/FF/Safari, IE comme d'habitude). Donc ça a l'air bien.
<select>
<option style="display: none"></option>
<option>First</option>
<option>Second</option>
<option>Third</option>
</select>
Ensuite, en utilisant jQuery nous relions change
et mousedown
événements d'une manière que lorsque mousedown
déclencheurs, select
remet à zéro sa valeur à la valeur de l'option cachée.
$("select").on({
change: function() {
console.log($(this).val());
},
mousedown: function() {
$(this).val($(":first", this).val());
}
});
DEMO:http://jsfiddle.net/LzNrS/
MISE À JOUR: Afin de préserver la valeur sélectionnée lorsque l'utilisateur a cliqué sur select
mais décidé de ne pas quoi que ce soit choisir, nous pouvons modifier le code un peu en ajoutant blur
événement et mettre à jour mousedown
.
var special = ""; // special hidden option value
var value = ""; // temporary variable
$("select").on({
change: function() {
console.log($(this).val());
},
mousedown: function() {
if (this.value == special) {
$(this).val(value);
return;
}
value = this.value;
$(this).val(special);
},
blur: function() {
if (this.value == special)
$(this).val(value);
}
});
Envisager également la navigation du clavier que l'OP mentionné. Bon travail. –
Belle solution. Finalement, comme il ne semble pas y avoir une solution totalement simple, j'ai décidé de contourner le problème en affichant la valeur actuelle dans une étiquette adjacente et en la mettant à jour, puis de la réinitialiser à l'option par défaut un événement. – wheresrhys
@wheresrhys Cela devrait fonctionner par tous les moyens :) – VisioN
Je ne sais pas si cela fonctionnerait seulement du haut de ma tête si vous pouviez attacher un gestionnaire d'événement à l'élément d'option de boîte de sélection et sur le clic stocker sa valeur.
travaille avec la souris, ne fonctionne pas avec le clavier http://jsfiddle.net/w4DEJ/4/
Je pense que la fonction mise au point() aidera you..try ceci: http://api.jquery.com/focus/
Je pense que vous avez mal compris la question – wheresrhys
- 1. Zone de détection d'impact instantané
- 2. Sélection de la zone d'écran
- 3. Détection de la souris sur la zone de liste déroulante
- 4. Affichage d'une zone de texte en fonction de la sélection dans la zone de sélection
- 5. Zone de sélection avec cliquer-glisser
- 6. Sélection de la zone de l'écran avec Python
- 7. Zone de sélection CheckBox
- 8. sélection de la zone sur la photo
- 9. Sélection de points géographiques dans la zone
- 10. Détection de l'effacement de l'utilisateur dans la zone de saisie
- 11. AVFoundation - Détection du visage et de la zone de recadrage?
- 12. La zone de sélection ne remplira pas avec javascript
- 13. Aide avec le sélecteur jQuery pour la zone de sélection
- 14. Aligner verticalement le panneau Bootstrap avec la zone de sélection
- 15. Remplir une zone de sélection avec la valeur actuellement sélectionnée
- 16. Détection d'une zone de superposition d'une seule couleur avec ImageMagick
- 17. Détection des caractères de zone d'utilisation privée unicode avec python
- 18. Masquer la zone de sélection dans IE?
- 19. Trier la zone de sélection classique ASP
- 20. Zone de sélection d'image JQuery
- 21. Détection de glisser déposer dans la zone de texte HTML?
- 22. Ajax appel sur Sélection multiple dans la zone de sélection
- 23. Détection de la sélection de propriétés dans propertyGrid
- 24. Remplir une zone de sélection multiple en fonction de la sélection d'une liste de sélection précédente
- 25. Sélection d'un élément dans une zone de liste via la liaison avec une zone de texte
- 26. Zone de sélection multi-colonnes
- 27. Détection C# et retour arrière dans la zone de texte pour recharger la zone de liste
- 28. GWT - sélection de zone/imagemap
- 29. Détection lorsque la valeur de la zone de texte change avec jQuery
- 30. Afficher plusieurs valeurs de zone de sélection avec jquery?
Il y a des chances que vous essayez d'aller sur quoi que ce soit dans le mauvais sens . Puis-je vous demander pourquoi vous voulez ce comportement? Personnellement, je m'oppose au changement de comportement du navigateur. –
@Tyler Crompton J'ai quelques lignes dans un tableau peuplé par Backbone et certaines des colonnes contiennent une boîte de sélection pour afficher et permettre la modification de la valeur. Je veux enregistrer un horodatage pour la dernière fois que l'utilisateur a interagi avec un enregistrement et il est important d'enregistrer même les interactions qui n'entraînent aucun changement. Fondamentalement, pour mes fins, un utilisateur qui évalue et envisage de changer la valeur est aussi important que de le changer. – wheresrhys