替换html textarea中的文本答案

【问题标题】：Replace text in html textarea替换html textarea中的文本
【发布时间】：2018-05-14 16:25:49
【问题描述】：

如果在减号之间，我有这个脚本匹配文本区域中 keyup 上的文本。

    $('#notes').keyup(function() { // notes is the id of the textarea
        var regex = /\-([^\)]+)\-/gmi; // it gets the text between minus sign. Example: -text-
        var myValue = $(this).val();
        if(myValue.match(regex)){
            var reference = myValue.match(regex);
            $.ajax({
                async: false, 
                type: "POST",
                url: "scripts/script.php",
                data: { "reference" : reference },
                success: function(data) {   
                    // I need to replace the text matched by the regex with data in the textarea.
                    // I need to stop the ajax calling after success or call it only if regex is matched
                }
            }); 
        }
    });

当文本与正则表达式匹配时，它会向脚本发送一个 ajax post 调用，该脚本在数据库中搜索世界并返回一个定义。我需要将正则表达式匹配的文本替换为数据，即数据库提取的定义。

此外，我想仅在匹配正则表达式时启动 ajax POST 调用。它只是第一次工作。在第一次匹配之后，它仍然会为每个 keyup 发送调用。

【问题讨论】：

您想替换用户在输入时输入的内容？我建议考虑其他方式，这听起来像是非常糟糕的用户体验
...在进入时使用
这不是一个输入，它是一个文本区域，它不是在打字时而是在减号之间的文本。
所以像匹配一样调用替换？
我试过了，但没有错误，文本区域中的值也没有改变： $((reference)[0]).replaceWith($(reference)[0], newValue ); // 其中 newValue 是 = 数据

标签： javascript jquery regex

【解决方案1】：

试试下面的代码。

var triggerTime;
$("#notes").keyup(function() { // notes is the id of the textarea
        clearTimeout(triggerTime);
        var myValue = $(this).val();
        triggerTime = setTimeout(function(){
            var regex = /\-([^\)]+)\-/gmi; // it gets the text between minus sign. Example: -text-
            if(myValue.match(regex)){
                var reference = myValue.match(regex);
                $.ajax({
                    async: false, 
                    type: "POST",
                    url: "scripts/script.php",
                    data: { "reference" : reference },
                    success: function(data) {   
                        // I need to replace the text matched by the regex with data in the textarea.
                        // I need to stop the ajax calling after success or call it only if regex is matched
                    }
                }); 
            }
        }, 3000);// Call request in 3 second
    });

这是您的代码的优化版本。它将等待用户完成，并且在 3 秒不活动的情况下，它会生成一个 Ajax 调用。

您可以将频率更改为 2000 或 1000（分别为 2 秒和 1 秒）。

【讨论】：

匹配后输入时仍会进行进一步调用。
第一次通话后你想停止通话吗？
是的。我希望在匹配正则表达式时调用。
目前，它应该调用匹配，但在替换为新文本后，你想替换/删除那些“-”（减号）吗？
php 脚本返回一个应该替换-text- 的短语。但它不起作用，所以也许是因为这个原因，它一直在打电话。关于如何替换 -text- 的任何建议？

【解决方案2】：

我解决了将 contenteditable="true" 添加到文本区域的问题。下面是最终的jquery代码：

    var textInput = $("#notes"); // the ID of the textarea
    var triggerTime;
    $("#notes").keyup(function() { // notes is the id of the textarea
        clearTimeout(triggerTime);
        var myValue = $(this).text();
        triggerTime = setTimeout(function(){
            var regex = /\-([^\)]+)\-/gmi; // it gets the text between minus sign. Example: -text-
            if(myValue.match(regex)){
                var newValue;
                var reference = myValue.match(regex);
                $.ajax({
                    async: false, 
                    type: "POST",
                    url: "scripts/parser.php",
                    data: { "reference" : reference },
                    success: function(data) {       
                        newValue = data;    
                        console.log(newValue);
                        $('.textarea').html(function() {
                            return $(this).text().replace(reference[0], '<strong>' + newValue + '</strong>');
                        });
                    }
                }); 
            }
        }, 1000);// Call request in 1 second
    });

【讨论】：