在光标位置的 wysihtml5 编辑器中添加新文本

Question

我在我的项目中实现了一个 wysihtml5 编辑器，在该编辑器中，我想在单击下拉菜单时附加某些文本。我使用了 jquery 的选择星号方法和 wysihtml5 编辑器的 setvalue 方法的组合。但是文本总是在最后追加。JSFiddle 是这样的。

[http://jsfiddle.net/nt11Lsg2/21/][1]

谢谢

le.net/nt11Lsg2/21/

Answer 1

尝试追加插入符号的索引。您可以获得这样的位置：

$("#myTextInput").bind("keydown keypress mousemove", function() {
  alert("Current position: " + $(this).caret().start);
});

来自 this

Answer 2

我将分享我多年来使用的执行类似功能的方法。用户单击下拉列表中的项目，一些文本被插入到文本框的插入符号处。

function insertAtCaret(areaId, ddlID) {
        var ddl = $find(ddlID);
        var text = ddl.get_value();

        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; 
    }

Answer 3

你可以试试这个：

var wysihtml5Editor = $('.textarea').data("wysihtml5").editor;
 wysihtml5Editor.composer.commands.exec("insertHTML", txtToAdd);

在光标位置的 wysihtml5 编辑器中添加新文本

Adding a new text in wysihtml5 editor at the cursor position

jquery

wysihtml5