Par défaut, le système utilise la touche Tab pour changer le focus des éléments de la page. Avez-vous déjà pensé que la touche Entrée pouvait également réaliser cette fonction et offrir une bonne expérience utilisateur. Ensuite, nous utilisons Jquery pour implémenter la touche Entrée pour changer de focus. Ce code a été testé dans les navigateurs couramment utilisés IE7, IE8, Firefox 3, Chrome 2 et Safari 4.
L'outil de développement utilisé est le framework Microsoft VS2010+Jquery
Les étapes de mise en œuvre sont les suivantes
1. Référencez d'abord la bibliothèque de classes Jquery
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
2. Code Javascript
<script type="text/javascript">
$(fonction () {
$('input:text:first').focus();
var $inp = $('input:text');
$inp.bind('keydown', fonction (e) {
var key = e. which;
si (clé == 13) {
e.preventDefault();
var nxtIdx = $inp.index(this) + 1;
$(":input:text:eq(" + nxtIdx + ")").focus();
}
});
});
</script>
analyser :
$('input:text:first').focus();
Lorsque la page est initialisée, le focus est positionné dans la première zone de texte
var $inp = $('input:text');
Prenez la collection d'éléments type=text box
$inp.bind('keydown', fonction (e) {}
Liez l'événement 'keydown' à la collection de zones de texte
var key = e. which;
Obtenez la valeur de la touche actuellement enfoncée, telle que Enter key value = 13
e.preventDefault();
Vous pouvez empêcher son comportement par défaut de se produire et que quelque chose d'autre se produise. Ici, nous empêchons PostBack de se produire et changeons de focus à la place. Une autre méthode similaire est stopPropagation, qui empêche les événements js de se propager.