如何仅在单击按钮后才执行脚本？

Question

我有一个脚本可以在 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, "\u2018");
              replace(/'/g, "\u2019");
              replace(/(^|[-\u2014/\[(\u2018\s])"/g, "\u201c");
              replace(/"/g, "\u201d");
          });
        });

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

我真的希望它只在用户点击按钮后工作，而不是在点击按钮之前自动替换。请告诉我如何修复此错误？

Answer 1

您替换文本区域内容的函数在输入侦听器中调用，所以你应该在一个单独的函数中得到它并在 fixText 函数中调用该函数

function fixTextarea(textarea) {
    textarea.value = textarea.value.replace(" ,", ",")
        .replace(" ;", ";")
        .replace(" .", ".")
        .replace("  ", " ")
        .replace("   ", " ")
        .replace("--", "—")
        .replace(/(^|[-\u2014\s(\["])'/g, "\u2018")
        .replace(/'/g, "\u2019")
        .replace(/(^|[-\u2014/\[(\u2018\s])"/g, "\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>

如何仅在单击按钮后才执行脚本？

How to execute script only after button onclick?

html

javascript

textarea