javascript - すべての入力ボックスをループしてクリアする

Question

JavaScript を使用して、ページ上のすべての入力ボックスをループし、それらの内部のデータをクリアする (すべて空白にする) にはどうすればよいですか?

Answer 1

このコードを試してください：

​$('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 = '';
});

Answer 2

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

編集：テキストエリアやその他の要素を取得したい場合は、次を使用できますquerySelectorAll：

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

Answer 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 = "";
    }
}

Answer 4

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 = '';
}

Answer 5

JavaScript を使用せずに代替を登録するためだけに、HTML 要素<input type="reset" />は のすべてのフィールドをクリアしますform。一部のシナリオでは、それで十分な場合があります。

Answer 6

次のようなことができます。

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

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

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

編集:タイプがテキストではない入力の除外を追加しました!