在文本框中设置最后一个字符后的焦点
我有3个电话号码的文本框。 用户input时，会自动从一个文本框移动到另一个文本框。 当用户按退格键时，我可以将焦点移到上一个文本框。 问题是在IE中，焦点被设置在文本框的开头。 这是我的代码，它在Chrome中工作正常。
$('#AreaCode').live('keyup', function (event) { if ($(this).val().length == $(this).attr("maxlength")) $('#Prefix').focus(); }); $('#Prefix').live('keyup', function (event) { if (event.keyCode == 8 && $(this).val().length == 0) $('#AreaCode').focus(); if ($(this).val().length == $(this).attr("maxlength")) $('#Number').focus(); }); $('#Number').live('keyup', function (event) { if (event.keyCode == 8 && $(this).val().length == 0) $('#Prefix').focus(); }); 如何在倒退的时候将内容设置在内容的最后？
这是做到这一点的简单方法。 如果您要倒退，只需添加$("#Prefix").val($("#Prefix").val()); 在你设定焦点后
这是更合适（更干净）的方式：
function SetCaretAtEnd(elem) { var elemLen = elem.value.length; // For IE Only if (document.selection) { // Set focus elem.focus(); // Use IE Ranges var oSel = document.selection.createRange(); // Reset position to 0 & then set at end oSel.moveStart('character', -elemLen); oSel.moveStart('character', elemLen); oSel.moveEnd('character', 0); oSel.select(); } else if (elem.selectionStart || elem.selectionStart == '0') { // Firefox/Chrome elem.selectionStart = elemLen; elem.selectionEnd = elemLen; elem.focus(); } // if } // SetCaretAtEnd()
我尝试了很多不同的解决scheme，唯一一个为我工作的是基于Chris G在本页的解决scheme（但稍作修改）。
我把它变成了一个jQuery插件，供将来使用的任何需要它的人使用
(function($){ $.fn.setCursorToTextEnd = function() { var $initialVal = this.val(); this.val($initialVal); }; })(jQuery);
用法示例：
$('#myTextbox').setCursorToTextEnd();
这对我来说很好。 [参考：Gavin G非常好的插件]
(function($){ $.fn.focusTextToEnd = function(){ this.focus(); var $thisVal = this.val(); this.val('').val($thisVal); return this; } }(jQuery)); $('#mytext').focusTextToEnd();
任何浏览器的代码：
function focusCampo(id){ var inputField = document.getElementById(id); if (inputField != null && inputField.value.length != 0){ if (inputField.createTextRange){ var FieldRange = inputField.createTextRange(); FieldRange.moveStart('character',inputField.value.length); FieldRange.collapse(); FieldRange.select(); }else if (inputField.selectionStart || inputField.selectionStart == '0') { var elemLen = inputField.value.length; inputField.selectionStart = elemLen; inputField.selectionEnd = elemLen; inputField.focus(); } }else{ inputField.focus(); } }
您可以按照以下方式在文本框的最后一个位置上设置指针。
temp=$("#txtName").val(); $("#txtName").val(''); $("#txtName").val(temp); $("#txtName").focus();
你应该这样编码。
var num = $('#Number').val(); $('#Number').focus().val('').val(num);
可以在input标签中使用这些简单的javascript。
<input type="text" name="your_name" value="your_value" onfocus="this.setSelectionRange(this.value.length, this.value.length);" autofocus />
<script type="text/javascript"> $(function(){ $('#areaCode,#firstNum,#secNum').keyup(function(e){ if($(this).val().length==$(this).attr('maxlength')) $(this).next(':input').focus() }) }) </script> <body> <input type="text" id="areaCode" name="areaCode" maxlength="3" value="" size="3" />- <input type="text" id="firstNum" name="firstNum" maxlength="3" value="" size="3" />- <input type="text" id="secNum" name=" secNum " maxlength="4" value="" size="4" /> </body>
var val =$("#inputname").val(); $("#inputname").removeAttr('value').attr('value', val).focus(); // I think this is beter for all browsers...
