按钮清除所有选择字段答案

【问题标题】：button to clear all select fields按钮清除所有选择字段
【发布时间】：2014-08-19 10:44:17
【问题描述】：

 <form method="post" action="asdasd" class="custom" id="search">
 <select name="sel1" id="sel1">
   <option value="all">all</option>
   <option value="val1">val1</option>
   <option value="val2" selected="selected">val2</option>
 </select>
 <select name="sel2" id="sel2">
   <option value="all">all</option>
   <option value="val3">val3</option>
   <option value="val4" selected="selected">val4</option>
 </select>
 </form>

我想选择所有Select的第一个字段（因此将值“all”设置为所有Select）单击一个按钮

【问题讨论】：

你有没有尝试过自己解决这个问题？看起来你在要求我们为你做你的工作......
SO 帮助您与他人分享问题，而不是要求他人完成您的工作

标签： javascript jquery select button reset

【解决方案1】：

您的表单应该有一个重置按钮

<form method="post" action="asdasd" class="custom" id="search">
 <select name="sel1" id="sel1">
   <option value="all">all</option>
   <option value="val1">val1</option>
   <option value="val2" selected="selected">val2</option>
 </select>
 <select name="sel2" id="sel2">
   <option value="all">all</option>
   <option value="val3">val3</option>
   <option value="val4" selected="selected">val4</option>
 </select>
 <input type="button" name="Reset" />
 </form>

在您的表单中添加一个重置按钮输入元素后，下面的代码应该重置所有选择字段。

jQuery( "input[name=Reset]" ).click( function(){ //jQuery click event
jQuery( "select" ).each(function() {     //for each select type
    $(this).val( "all" );
});

});

【讨论】：

【解决方案2】：

您必须在所有选择框的第一个选项中添加属性selected。

$("select option:first").attr('selected','selected');

见my fiddle

希望对你有帮助。

【讨论】：

【解决方案3】：

您不需要使用 jquery。这可以通过 JavaScript 完成

  document.getElementById("sel1").selectedIndex = 0;

这是我的JSFiddler demo 完整代码。

这是上面的jQuery实现方式

  $("select").val("0");

或者更具体的

  $("#sel1 , #sel2").val("0");

【讨论】：