提问人：Carlos Morales 提问时间：11/13/2015 最后编辑：CommunityCarlos Morales 更新时间：5/8/2020 访问量：35301
如何在不添加方法或类的情况下修剪所有输入中的空格？
How can trim spaces in all inputs without adding methods or classes?
问：
我试图在不添加类或 id 或事件的情况下删除输入开头和结尾的空格
我尝试了这个现场演示，但正在使用 onchange 事件
<javascript>
function trim(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;
}
</script>
<p>Search1: <input type="text" onchange="return trim(this)" /></p>
<p>Search2: <input type="text" onchange="return trim(this)" /></p>
<p>Search3: <input type="text" onchange="return trim(this)" /></p>
<p>Search4: <input type="text" onchange="return trim(this)" /></p>
<p>Search5: <input type="text" onchange="return trim(this)" /></p>
有人可以帮助我如何使我的所有输入修剪输入值（CSS或JAVASCRIPT），如下所示：
<script>
Here in this script will trim blank spaces starting or ending so don't need to add anything in the input
</script>
<input type="text" />
我试过这个，但不起作用
$(.input).text().trim()
请有人能帮我吗？
提前致谢。
答：
18赞
BenG
11/13/2015
#1
尝试使用文本类型输入：-$.trimchange
jQuery的
$(function(){
$('input[type="text"]').change(function(){
this.value = $.trim(this.value);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Search1: <input type="text"/></p>
<p>Search2: <input type="text"/></p>
<p>Search3: <input type="text"/></p>
<p>Search4: <input type="text"/></p>
<p>Search5: <input type="text"/></p>香草
window.onload = function() {
var inputs = document.getElementsByTagName('input');
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].type == 'text') {
inputs[i].onchange = function() {
this.value = this.value.replace(/^\s+/, '').replace(/\s+$/, '');
};
}
}
}<p>Search1: <input type="text"/></p>
<p>Search2: <input type="text"/></p>
<p>Search3: <input type="text"/></p>
<p>Search4: <input type="text"/></p>
<p>Search5: <input type="text"/></p>评论
0赞
Carlos Morales
11/13/2015
此代码是解决此问题的唯一方法吗？问题是：我有几个javascript（prototype，jquery）并且不想发生冲突。
0赞
Carlos Morales
11/13/2015
天哪，很好的答案，你救了我的命，这就是我想要的。非常感谢 +1 的帮助，+1 投票，+1 谢谢。
1赞
kejo
2/5/2021
感谢BenG一百万。我发现唯一有效的代码是您的“Vanilla”代码。我在任何地方都没有找到任何实际有效的jquery代码。非常感谢。
0赞
Ringo
4/6/2021
这个答案已经过时了。只需使用 String.prototype.trim（）。这里有例子：developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/......
0赞
Iecya
11/13/2015
#2
试试这个：
function trim(el) {
var trimmedValue = el.val().trim();
el.val(trimmedValue);
}
你的 .trim（） 语法是错误的。 要修剪输入的值，您不需要任何正则表达式，只需尝试更改它：
$(.input).text().trim();
对此：
$('input').val().trim();
input 不是一个类，所以你不必在它前面加上点。然后你必须把它包含在''中。输入的值由 val（） 方法给出，而不是 text（）。
这只会修剪输入的值，您必须在函数中使用它才能使其正常工作，如上例所示。
评论
0赞
Evan Davis
11/13/2015
这并不像你认为的那样。
0赞
Iecya
11/13/2015
@Mathletics你能说得更具体一点吗？
0赞
Evan Davis
11/13/2015
你有一个（大概）从不被调用的全局函数。然后，您提供将用于字符串值的示例，但您没有对它执行任何操作。这将只返回修剪后的值，而不是更新输入的值。trim$('input').val().trim();String.prototype.trim
0赞
Iecya
11/13/2015
我知道如果你不在任何地方调用它，它就不起作用。我编辑了我的答案，希望现在很清楚我的意思了。谢谢
1赞
Aagrlp640
5/8/2020
#3
这是我发现:)的最简单方法之一，它使用jquery希望它有帮助，它使用您的函数 输入必须仅为：
<input type="text" name="name">
这会自动更改所有输入，或者您可以签名到类
function trim_text(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;
}
$(function(){
$("textarea").change(function() {
trim_text(this);
});
$("input").change(function() {
trim_text(this);
});
});
评论