Sélection de la valeur de la zone de texte lorsque vous appuyez sur le bouton suivant

J'ai une grille de zones de texte. Lorsque l'utilisateur appuie sur le bouton fléché, j'ai besoin du curseur pour sélectionner le contenu de la zone de texte dans la direction qu'ils viennent de pousser. J'ai essayé d'utiliser la méthode .select() de JQuery, mais cela ne semble pas fonctionner dans IE.Sélection de la valeur de la zone de texte lorsque vous appuyez sur le bouton suivant

Pourriez-vous me donner des suggestions pour que cela fonctionne?

Merci d'avance.

Source

2010-07-06 Steve

Quelqu'un peut-il fixer le droit et gauche ici? Up et fait descendre l'astuce, naviguer à l'intérieur des zones de texte semblent prendre precedense

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>test tab</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script> 
<script type="text/javascript"> 
function checkKey(e){ 
    switch (e.keyCode) { 
     case 40: 
      current = $("#field1"); 
      $("#msg").html(current.id); 
      setTimeout('focusIt()',100); 
      break; 
     case 38: 
      current = $("#field3"); // or some more clever way of finding the last field 
      $("#msg").html(current.id); 
      setTimeout('focusIt()',100); 
      break; 
     case 37: 
      if (prev) current = prev; 
      else current = $("#field3"); // or some more clever way of finding the last field 
      $("#msg").html(current.id); 
      setTimeout('focusIt()',100); 
      break; 
     case 39: 
      if (next) current = next; 
      else current = $("#field1") 
      $("#msg").html(current.id); 
      setTimeout('focusIt()',100); 
      break; 
     default: 

      }  
} 
function focusIt() { 
    if(current) {current.focus(); current.select() } 
} 
var current,next,prev; 
$(document).ready(function() { 
    if ($.browser.mozilla) { 
    $("input").keypress (checkKey); 
    } else { 
    $("input").keydown (checkKey); 
    } 
    $("input").focus(function() { 
    current=this; 
    $("#msg").html(current.id); 
    next = $("field"+(parseInt(current.id.replace('field',''))+1)); 
    prev = $("field"+(parseInt(current.id.replace('field',''))-1)); 
    }); 
}); 
</script> 
</head> 
<body> 
<div id="pagecontent" style="width:95%; margin:10px 10px 10px 10px"> 
    <form> 
    <input type="text" id="field1" value="first"/><input type="text" id="field2" value="second"/><input type="text" id="field3" value="third"/> 
    </form> 
    <span id="msg"></span> 
</div> 
</body> 
</html>

Source

2010-07-06 12:36:21 mplungjan

PS code initial du lien que j'ai posté dans le commentaire – mplungjan

Il suffit d'utiliser la méthode zone de texte select(), qui fonctionne dans tous les principaux navigateurs scriptable, tant que vous avez mis l'accent en premier:

<input type="text" id="aTextBox" value="Some text"> 
<script type="text/javascript"> 
    var textBox = document.getElementById("aTextBox"); 
    textBox.focus(); 
    textBox.select(); 
</script>

Source

2010-07-06 09:46:07

Lorsque vous appuyez sur la flèche, Tim – mplungjan

Je trouve ceci: http: //stackoverflow.com/questions/492865/jquery-keypress-event-not-firing – mplungjan

À droite, lorsque vous appuyez sur la flèche, c'est bien. J'ai déduit (peut-être incorrectement) de la question que ce n'était pas le problème et était accessoire. Le bit qui semblait être le problème était la sélection: * "J'ai essayé d'utiliser la méthode .select() de JQuery, mais cela ne semble pas fonctionner dans IE." * –

<input type="text" id="aTextBox" value="Some text"> 
<script type="text/javascript"> 
    $('#TextBox').focus().select(); 
</script>

Essayez d'utiliser les deux dans une ligne

Source

2010-07-06 12:39:17 RobertPitt

Merci Robert je les ai essayés sur une ligne mais cela n'a pas semblé fonctionner. – Steve

Sélection de la valeur de la zone de texte lorsque vous appuyez sur le bouton suivant

Répondre

Questions connexes