Trim 使用 JavaScript 所有输入字段的空格

Question

寻找纯 JavaScript 在 IE 中专门用于从所有输入（文本和文本区域）中删除所有额外的空白。

这是可用的 jQuery 版本，但我希望在 JavaScript 中使用：

function TrimText(el) {
 el.value = el.value.
 replace(/(^\s*)|(\s*$)/gi, ""). // removes leading and trailing spaces
 replace(/[ ]{2,}/gi, " "). // replaces multiple spaces with one space
 replace(/\n +/, "\n"); // removes spaces after newlines
 return;
}

将其转换为 JavaScript 的最佳方法是什么？

$j(function () {
 $j("textarea").change(function () {
    TrimText(this);
 });

 $j("input").change(function () {
    TrimText(this);
 });
});

Answer 1

如果您想将此应用于当前页面中的所有输入：

document.querySelectorAll('input, textarea').forEach(function(el) {
  el.addEventListener('change', function(ev) { TrimText(ev.target); });
});

如果您想将其应用于当前页面中的所有输入以及将来创建的所有输入：

document.addEventListener('change', function (ev) {
  if(ev.target.tagName === 'INPUT' || ev.target.tagName === 'TEXTAREA')
    TrimText(ev.target);
});

这是通过使用一种称为冒泡的机制来实现的。 Javascript 中的事件通过 DOM 冒泡并最终到达 document 元素。所以，我们监听document元素中的事件，并通过目标的标签名过滤事件。

这就是 JQuery 内部的工作方式，这种方法适用于您可以在 JQuery 中做的其他事情。

Answer 2

根据您的要求，这是一个简单的 JavaScript 方法。这将删除所有额外的 space，包括前导和尾随 space，并保留单个 space.

工作演示：

function removeWhiteSpaces(){
    var value = document.getElementById("text").value;
    document.getElementById("text").value = value.replace(/\s+/g,' ').trim();
}

<input type="text" id="text" value="  I am  a bad    text"/>
<button onclick="removeWhiteSpaces()">Remove White Spaces</button>

Trim 使用 JavaScript 所有输入字段的空格

Trim white-spaces from all input fields using JavaScript

javascript

trim

spaces