jquery - 如何使用 jQuery 清除特定 div 中的所有输入字段？

Question

我正在尝试使用 jQuery 来做一件简单的事情:每当表单加载或用户更改选项列表时，清除 div 中一组输入字段的输入字段；但我很难让选择器正常工作。

首先，这是我的 onclick 和 onload 触发器:

<form name="EditGenotype" action="process_GenotypeMaint.php" method="POST" onsubmit="return false" onload=clear_fetch() >

在选项列表上:

<SELECT multiple size=6 NAME="marker" onchange=show_marker() onclick=clear_fetch() >

接下来，这是我要清除的 div 中的 HTML 输入元素:

  <div class=fetch_results>
      <fieldset>
    <LEGEND><b>Edit Genotype, call 1</b></LEGEND>
      <boldlabel>Allele_1</boldlabel><input id=allele_1_1 name=allele_1_1 size=5 >
      <boldlabel>Allele_2</boldlabel><input id=allele_1_2 name=allele_1_2 size=5 >
      <boldlabel>Run date</boldlabel><input id=run_date1 name=run_date1 size=10 disabled=true>
      </fieldset>
      <fieldset>
    <LEGEND><b>Edit Genotype, call 2</b></LEGEND>
      <boldlabel>Allele_1</boldlabel><input id=allele_2_1 name=allele_2_1 size=5 >
      <boldlabel>Allele_2</boldlabel><input id=allele_2_2 name=allele_2_2 size=5 >
      <boldlabel>Run date</boldlabel><input id=run_date2 name=run_date2 size=10 disabled=true>
      </fieldset>
      <fieldset>
    <LEGEND><b>Edit Genotype, call 3</b></LEGEND>
      <boldlabel>Allele_1</boldlabel><input id=allele_3_1 name=allele_3_1 size=5 >
      <boldlabel>Allele_2</boldlabel><input id=allele_3_2 name=allele_3_2 size=5 >
      <boldlabel>Run date</boldlabel><input id=run_date3 name=run_date3 size=10 disabled=true>
      </fieldset>
    </div>

最后，这是我的脚本:

 function clear_fetch() {    

    $('#fetch_results:input', $(this)).each(function(index) {
      this.value = "";
    })

  }

但是，没有任何反应...所以，我的选择器一定不正确。有人看到我做错了什么吗？

Answer 1

fiddle : http://jsfiddle.net/simple/BdQvp/

你可以这样做:

我在 Fiddle 中添加了两个按钮，以说明如何通过按钮在这些输入字段中插入或清除值。您只需捕获 onClick 事件并调用该函数即可。

//Fires when the Document Loads, clears all input fields
$(document).ready(function() {
  $('.fetch_results').find('input:text').val('');    
});

//Custom Functions that you can call
function resetAllValues() {
  $('.fetch_results').find('input:text').val('');
}

function addSomeValues() {
  $('.fetch_results').find('input:text').val('Lala.');
}

更新:

查看this great answer below by Beena以及更通用的方法。