在A中,textarea
我正在执行两项操作-一种是找到当前光标的位置,第二种是在当前光标所在的位置插入一些文本。请注意,这不是鼠标X / Y坐标的情况。实际上我正在使用字符索引号。除了一个问题,一切似乎都运行良好。当我在当前光标位置插入一些文本时,在插入文本后,光标将移至字符串末尾。我想避免这种情况。而不是我想将光标保持在插入文本的末尾。
这是我的代码:
$(document).ready(function() {
// Get current cursor position
$("#btngetcurpos").click(function() {
var cursor_pos = $("#my_textarea").prop('selectionStart');
alert(cursor_pos);
$("#my_textarea").focus();
});
// Insert text at current cursor position
$("#btnsettxt").click(function() {
var cursor_pos = $("#my_textarea").prop('selectionStart');
var textarea_txt = $("#my_textarea").val();
var txt_to_add = "test";
$("#my_textarea").val(textarea_txt.substring(0, cursor_pos) + txt_to_add + textarea_txt.substring(cursor_pos));
$("#my_textarea").focus();
});
});
#my_textarea {
border: 1px solid red;
width: 300px;
height: 100px;
padding: 5px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<textarea id="my_textarea" autofocus>This is a textarea.</textarea>
<br /><br />
<input type="button" id="btngetcurpos" value="Get Cursor Position" />
<input type="button" id="btnsettxt" value="Insert Text" />
例如,如果我当前的光标位于字符串“ This is a textarea”的开头。并插入文本“ test”,尽管该文本插入在开头,但光标移至整个字符串的结尾。而不是到最后,它应该在文本“ test”之后保留。
只需使用它selectionEnd
并加上txt_to_add
长度
$(document).ready(function() {
// Get current cursor position
$("#btngetcurpos").click(function() {
var cursor_pos = $("#my_textarea").prop('selectionStart');
alert(cursor_pos);
$("#my_textarea").focus();
});
// Insert text at current cursor position
$("#btnsettxt").click(function() {
var cursor_pos = $("#my_textarea").prop('selectionStart');
var textarea_txt = $("#my_textarea").val();
var txt_to_add = "test";
$("#my_textarea").val(textarea_txt.substring(0, cursor_pos) + txt_to_add + textarea_txt.substring(cursor_pos));
$("#my_textarea").focus();
$('#my_textarea').prop('selectionEnd', cursor_pos + txt_to_add.length);
});
});
#my_textarea {
border: 1px solid red;
width: 300px;
height: 100px;
padding: 5px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<textarea id="my_textarea" autofocus>This is a textarea.</textarea>
<br /><br />
<input type="button" id="btngetcurpos" value="Get Cursor Position" />
<input type="button" id="btnsettxt" value="Insert Text" />
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句