jQuery textarea - 插入模式光标位置

发布于 2024-09-16 15:46:29 字数 246 浏览 3 评论 0原文

在文本区域中,如何使用 jQuery 在光标位置旁边插入模式 name ,然后光标应位于模式后面:这应该在单击按钮时发生

     <input type="button" value="insert pattern" >
     <textarea rows="10" id="comments">INSERT The condition</textarea>

In a text area how to insert the pattern name next to the cursor position using jQuery and after which the cursor should be after the pattern:This should happen on the button click

     <input type="button" value="insert pattern" >
     <textarea rows="10" id="comments">INSERT The condition</textarea>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

时光暖心i 2024-09-23 15:46:29

请参阅此答案。这就是我得到 insertAtCaret() 方法的地方。我继续将其连接到您的按钮...不确定您所说的“模式名称”到底是什么意思。这是 SQL 的事情吗?它是否基于 HTML 中的某些先前输入字段?如果没有更多细节,很难提供比这更多的帮助。

function insertAtCaret(areaId,text) {
    var txtarea = document.getElementById(areaId);
    var scrollPos = txtarea.scrollTop;
    var strPos = 0;
    var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ? 
        "ff" : (document.selection ? "ie" : false ) );
    if (br == "ie") { 
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart ('character', -txtarea.value.length);
        strPos = range.text.length;
    }
    else if (br == "ff") strPos = txtarea.selectionStart;

    var front = (txtarea.value).substring(0,strPos);  
    var back = (txtarea.value).substring(strPos,txtarea.value.length); 
    txtarea.value=front+text+back;
    strPos = strPos + text.length;
    if (br == "ie") { 
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart ('character', -txtarea.value.length);
        range.moveStart ('character', strPos);
        range.moveEnd ('character', 0);
        range.select();
    }
    else if (br == "ff") {
        txtarea.selectionStart = strPos;
        txtarea.selectionEnd = strPos;
        txtarea.focus();
    }
    txtarea.scrollTop = scrollPos;
}


$(document).ready(function(){
  $("#insertPattern").click(function(){
    insertAtCaret("comments","name");
  });
});​

然后,在您的 HTML 中:

  <input id="insertPattern" type="button" value="insert pattern" />
  <textarea rows="10" id="comments">INSERT The condition</textarea>

希望这有帮助!

Please see this answer. That's where I got the insertAtCaret() method. I went ahead and hooked it up to your button...not sure exactly what you mean by "the pattern name." Is that a SQL thing? Is it based on some previous input field in HTML? Hard to help any further than this without more detail.

function insertAtCaret(areaId,text) {
    var txtarea = document.getElementById(areaId);
    var scrollPos = txtarea.scrollTop;
    var strPos = 0;
    var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ? 
        "ff" : (document.selection ? "ie" : false ) );
    if (br == "ie") { 
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart ('character', -txtarea.value.length);
        strPos = range.text.length;
    }
    else if (br == "ff") strPos = txtarea.selectionStart;

    var front = (txtarea.value).substring(0,strPos);  
    var back = (txtarea.value).substring(strPos,txtarea.value.length); 
    txtarea.value=front+text+back;
    strPos = strPos + text.length;
    if (br == "ie") { 
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart ('character', -txtarea.value.length);
        range.moveStart ('character', strPos);
        range.moveEnd ('character', 0);
        range.select();
    }
    else if (br == "ff") {
        txtarea.selectionStart = strPos;
        txtarea.selectionEnd = strPos;
        txtarea.focus();
    }
    txtarea.scrollTop = scrollPos;
}


$(document).ready(function(){
  $("#insertPattern").click(function(){
    insertAtCaret("comments","name");
  });
});​

Then, in your HTML:

  <input id="insertPattern" type="button" value="insert pattern" />
  <textarea rows="10" id="comments">INSERT The condition</textarea>

Hope this helps!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文