按下一个按钮时选择文本框值

时间:2010-07-06 09:42:36

标签: javascript jquery

我有一个文本框网格。当用户按下箭头按钮时,我需要光标在他们刚按下的方向上选择文本框的内容。我尝试过使用JQuery的.select()方法,但这似乎不适用于IE。

你能否就如何使其发挥作用提出建议?

提前致谢。

3 个答案:

答案 0 :(得分:0)

只需使用文本框的select()方法,该方法适用于所有主要的可编写脚本的浏览器,只要您首先关注它:

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

答案 1 :(得分:0)

有人可以在这里修复左右吗? 上下诀窍,在文本框内导航似乎先于

<!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>

答案 2 :(得分:0)

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

尝试在一行中使用它们