使用jQuery在输入的文本中设置光标
Set cursor within text of input using jQuery
使用此主题:jQuery设置文本区域中的光标位置
我写了这个代码,但它不起作用:
<input id="myTextInput" type="text" value="some text2">
<input type="button" value="set mouse" id="btn" />
和:
$(document).ready(function () {
$('#btn').on('click', function () {
var inp = $('#myTextInput');
var pos = 3;
inp.focus();
if (inp.setSelectionRange) {
inp.setSelectionRange(pos, pos);
} else if (inp.createTextRange) {
var range = inp.createTextRange();
range.collapse(true);
if (pos < 0) {
pos = $(this).val().length + pos;
}
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
});
});
演示
我的错误在哪里?感谢
您的错误是选择了jQuery对象而不是DOM元素:用var inp = $('#myTextInput')[0];
替换var inp = $('#myTextInput');
。
JSFIDDLE
然而,我建议使用这个答案中的插件,因为代码看起来更干净:
$.fn.selectRange = function(start, end) {
return this.each(function() {
if (this.setSelectionRange) {
this.focus();
this.setSelectionRange(start, end);
} else if (this.createTextRange) {
var range = this.createTextRange();
range.collapse(true);
range.moveEnd('character', end);
range.moveStart('character', start);
range.select();
}
});
};
$(document).ready(function() {
$('#btn').on('click', function() {
var pos = 7;
$('#myTextInput').focus().selectRange(pos, pos);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="myTextInput" type="text" value="some text2">
<input type="button" value="set mouse" id="btn" />
要使用setSelectionRange
或createTextRange
,需要DOM元素而不是JQuery对象。使用.get(0)
进行检索。
var inp = $('#myTextInput');
inp.focus();
inp = inp.get(0);
http://jsfiddle.net/qeanb8gk/1/
相关文章:
- 将文本插入光标所在的文本区域
- 提交表单后,Watir文本框输入未持续(重置为以前的文本框输入)
- 使用jQuery重置文本,同时存在AJAX调用
- 无法在Chrome控制台中使用javascript将焦点和光标设置为输入文本
- jQuery/Javascript>on单击将文本放置在最后一个已知的光标位置
- 当用户单击按钮(在光标位置)时,在输入字段中添加一个文本字符串
- 如何在按键事件发生后获取文本光标的位置
- 同时在两个文本框上显示光标
- 我可以通过javascript在鼠标光标旁边动态添加文本吗?
- 将光标放在 javascript 文本框的末尾
- jQuery - 光标后面的文本
- 测试光标是否位于文本区域中的第一行(使用软换行符)
- ContentEditable元素--将光标移回可编辑文本的开头
- 如何更改文本区域中闪烁的光标/插入符号
- 当我单击画布并拖动鼠标时,光标将变为文本选择光标.我该如何防止这种情况发生
- 在光标位置的文本区域中插入一个字符串,并进行一些更改
- 重置javascript文本框
- 按下“按钮--重置”后文本未更改
- 如何重置Raphael文本元素的bbox数据
- 防止“向上箭头”;键在文本框内重置光标位置