遍历所有输入框并清理它们

时间:2012-11-17 22:05:06

标签: javascript html5 dom

我如何使用javascript遍历页面上的所有输入框并清除其中的数据(使它们全部为空白)?

6 个答案:

答案 0 :(得分:15)

试试这段代码:

​$('input').val('');

它循环遍历所有input元素,并将其值设置为空字符串。 这是一个演示:http://jsfiddle.net/maqVn/1/

当然,如果你没有jQuery:

var inputs = document.getElementsByTagName('input');
for (var i = 0; i < inputs.length; i += 1) {
    inputs[i].value = '';
}​​​​

由于我更喜欢​​功能风格,您可以使用:

Array.prototype.slice.call(
  document.getElementsByTagName('input'))
  .forEach(function (el) {
    el.value = '';
});

答案 1 :(得分:6)

[].forEach.call(document.getElementsByTagName('input'), function(e){
  e.value = '';
});

修改:如果您想抓取textareas和其他元素,可以使用querySelectorAll

[].forEach.call(
  document.querySelectorAll('input, textarea'), 
  function(e) { e.value = ''; }
);

答案 2 :(得分:3)

var inputs = document.getElementsByTagName("input"), 
    clearTypes = { "text" : 1, "password" : 1, "email" : 1 }, // etc. you fill this in
    i = inputs.length, 
    input;

while (i) {
    if (clearTypes[(input = inputs[--i]).type]) {
        input.value = "";
    }
}

答案 3 :(得分:1)

没有jquery:

var list = document.getElementsByTagName('input');
for(var i = 0; i < list.length; i++) {
  if(list[i].type == 'text' || list[i].type == 'password')
    list[i].value = '';
}

答案 4 :(得分:1)

只是为了注册没有JavaScript的备选方案,HTML元素<input type="reset" />会清除form的所有字段。在某些情况下,它可能就足够了。

答案 5 :(得分:0)

您可以执行以下操作:

<script>   
 e = document.getElementsByTagName('input');

    for (i = 0; i < e.length; i++){
    if (e[i].type != 'text') continue;

    e[i].value = '';
    }
</script>

已编辑:为输入添加了排除类型不是文本的输入!