仅在点击按钮后如何执行脚本?

问题描述

我有一个脚本可以自动double spaces中的特定字符(如single space替换为straight quotes,将smart quotes替换为textarea

但是,当我尝试添加onclick功能时,它对我不起作用,在单击按钮之前(它检测到字符时)它仍在执行。

这是我现在的样子:

        function fixtext() {
            let textarea = document.getElementById("textarea1");
            textarea.select();
            document.execCommand("fixtext");
        }
    
    window.addEventListener('DOMContentLoaded',function(e) {
          var area = document.getElementById("textarea1");

          var getCount = function (str,search) {
              return str.split(search).length - 1;
          };

          var replace = function (search,replaceWith) {
              if (typeof(search) == "object") {
                  area.value = area.value.replace(search,replaceWith);
                  return;
              }
              if (area.value.indexOf(search) >= 0) {
                  var start = area.selectionStart;
                  var end = area.selectionEnd;
                  var textBefore = area.value.substr(0,end);
                  var lengthDiff = (replaceWith.length - search.length) * getCount(textBefore,search);
                  area.value = area.value.replace(search,replaceWith);
                  area.selectionStart = start + lengthDiff;
                  area.selectionEnd = end + lengthDiff;
              }
          };

          area.addEventListener("input",function (e) {
              replace(",",");
              replace(" ;",";");
              replace(" .",".");
              replace("  "," ");
              replace("   "," ");
              replace("--","—");
              replace(/(^|[-\u2014\s(\["])'/g,"$1\u2018");
              replace(/'/g,"\u2019");
              replace(/(^|[-\u2014/\[(\u2018\s])"/g,"$1\u201c");
              replace(/"/g,"\u201d");
          });
        });
@H_404_22@<textarea id="textarea1" cols="40" rows="8"></textarea> <button class="cbtn" title="Fix text" onclick="fixtext()">Fix text</button>

我真的希望它仅在用户单击按钮后才起作用,而不是在它之前自动替换。请告诉我如何解决错误

解决方法

您的替换文本区域内容的函数在输入侦听器中调用, 所以您应该在单独的函数中找到它,然后在fixText函数中调用该函数

function fixTextarea(textarea) {
    textarea.value = textarea.value.replace(",",")
        .replace(" ;",";")
        .replace(" .",".")
        .replace("  "," ")
        .replace("   "," ")
        .replace("--","—")
        .replace(/(^|[-\u2014\s(\["])'/g,"$1\u2018")
        .replace(/'/g,"\u2019")
        .replace(/(^|[-\u2014/\[(\u2018\s])"/g,"$1\u201c")
        .replace(/"/g,"\u201d")
};



function fixtext() {
    let textarea = document.getElementById("textarea1");
    textarea.select();
    fixTextarea(textarea);
}

window.addEventListener('DOMContentLoaded',function (e) {
    var area = document.getElementById("textarea1");

    var getCount = function (str,search) {
        return str.split(search).length - 1;
    };

    var replace = function (search,replaceWith) {
        if (typeof (search) == "object") {
            area.value = area.value.replace(search,replaceWith);
            return;
        }
        if (area.value.indexOf(search) >= 0) {
            var start = area.selectionStart;
            var end = area.selectionEnd;
            var textBefore = area.value.substr(0,end);
            var lengthDiff = (replaceWith.length - search.length) * getCount(textBefore,search);
            area.value = area.value.replace(search,replaceWith);
            area.selectionStart = start + lengthDiff;
            area.selectionEnd = end + lengthDiff;
        }
    };

});
<textarea id="textarea1" cols="40" rows="8"></textarea>
<button class="cbtn" title="Fix text" onclick="fixtext()">Fix text</button>