Question

我正在制作一个格式化的文本编辑器，而不是基于按钮。我有以下JS：

    function titleFocus() {
        $(".title").css("border", "1px solid #666666");
    }
    function titleBlur() {
        $(".title").css("border", "none");
    }
    $(document).ready(function() {
        $('.input').bind('input propertychange', function() {
            var inputString = $(".input").html();
            var newInputString= inputString.replace(/:strong:(.*?):strong:/g, ':strong:<strong class="written">$1</strong>:strong:');
            var newInputString= newInputString.replace(/:b:(.*?):b:/g, ':b:<strong class="written">$1</strong>:b:');
            var newInputString= newInputString.replace(/:italic:(.*?):italic:/g, ':italic:<strong class="written">$1</strong>:italic:');
            var newInputString= newInputString.replace(/:i:(.*?):i:/g, ':i:<strong class="written">$1</strong>:i:');
            if (newInputString !== inputString) {
                console.log (newInputString);    
                $(".input").html(newInputString);
            }
        });
    });

问题是，在我完成格式化队列（:strong:或italic）后，每次键入一个字符时，光标都会开始。最初编写格式化que后，它也会执行此操作。我怎么能阻止这个？此外，是否有更有效的方式来实现我正在做的事情？我担心每次有人输入一个角色时都会运行一大块JS会导致延迟。

编辑：显然，此代码会导致格式化的内容重复。

E.G：:strong:<strong class="written"><strong class="written">TEXT</strong></strong>:strong:

编辑具有contenteditable的div时保持光标位置

0 个答案: