单击按钮时将文本插入到 <textarea> 中，光标所在的位置答案

【问题标题】：Insert text into a <textarea> when a button is clicked, where the cursor was positioned单击按钮时将文本插入到 <textarea> 中，光标所在的位置
【发布时间】：2013-07-10 09:02:36
【问题描述】：

我有一个<textarea>，下面有几个按钮，这些按钮的目的是在<textarea> 中插入某些文本。

下面的代码将始终在<textarea> 的开头插入所需的文本，如果单击按钮时没有焦点，这很好。但是，如果 <textarea> 确实有焦点，我想在单击按钮时将文本插入光标所在的位置。

到目前为止，这是我的代码。如果有人可以建议我需要如何执行此操作，我将不胜感激。谢谢。

jQuery(document).ready(function(){

    var button_text = {} // The text to insert for each button click

    button_text['insert_event_name']        = 'event_name';
    button_text['insert_event_date']        = 'event_date';
    button_text['insert_event_start_time']  = 'event_start';
    button_text['insert_event_finish_time'] = 'event_finish';
    button_text['insert_event_location']    = 'event_location';
    button_text['insert_event_address']     = 'event_address';

    jQuery('.inserter', '#event-desc-container').on('click', function(){

        var button = jQuery(this).attr('name');
        var text = '['+button_text[button]+']';

        textarea = jQuery('textarea#event_desc', '#event-desc-container');
        desc = textarea.val()

        textarea.val(text+desc);

    });

});

【问题讨论】：

stackoverflow.com/questions/3308292/…
不起作用，因为我一按按钮，textarea就会失去焦点，因此selectionStart、selectionEnd等都是undefinded。谢谢。
是的，所以你需要弄清楚如何防止这种情况发生。在 textarea 上调用 focus() 并在 click 事件上调用 preventDefault() 将在大多数浏览器中工作。添加unselectable="on" 将使其在IE 中工作。或者，改用mousedown 事件。
stackoverflow.com/questions/7469420/…
蒂姆，这就是这个问题的基础 - 我不知道如何防止它！无论如何，现在已经解决了。谢谢。

标签： javascript cursor textarea

【解决方案1】：

可以使用这个 jQuery 插件轻松完成： http://dwieeb.github.io/jquery-textrange/

【讨论】：

不起作用。无论您如何使用它，都会在第 190 行 (Firefox 22.0) 收到错误 invalid 'in' operand。谢谢。
奇怪。你试过demo.html吗？如果我理解正确，那正是您要找的。span>
我收回我的评论，这是我的编码错误。现在让它工作得很好，它正是我所追求的（用两行代码！）。感谢您的提示。