Question

我需要创建一个重置按钮，点击它会将表单中的所有选择列表设置为索引0.我已经尝试了这个代码用于函数，但它在myForm.length上给出了语法错误;

<script type="text/javascript">function ResetForm(form) {     
var myForm = document.forms[form];   
  for( var i=0; i < myForm.length; i++ ){                                   
myForm.select[i].selectedIndex =0;     }  }

</script>

Answer 1

没有someForm.select这样的属性，请尝试这样做：

selectTags = myForm.getElementsByTagName("select");

for(var i = 0; i < selectTags.length; i++) {
  selectTags[i].selectedIndex =0;
}

Answer 2

您只需设置.selectedIndex属性，如mySelect.selectedIndex = 0;中所示。试试下面的例子。

＆＃13;

var doc = document;
var myCheckbox = doc.getElementById('my-checkbox');
var mySelect = doc.getElementById('my-select');

myCheckbox.addEventListener("click", function(e){
  if (this.checked){
    mySelect.disabled = false;     
  } else {
    mySelect.selectedIndex = 0;
    mySelect.disabled = true;     
  }
});

＆＃13;

<label><input type="checkbox" id="my-checkbox" value=""> Enable Dropdown</label><br>

<select id="my-select" disabled>
  <option class="placeholder" selected disabled value="">Select credential</option>
  <option value="apples">apples</option>
  <option value="oranges">oranges</option>
  <option value="bananas">bananas</option>
</select>

＆＃13;

Answer 3

你可能会发现jquery在这里很有用。这应该成功......

$(function()
{
    $('.resetButton').click(function()
    {
        $(this).closest('form').find('select').each(function()
        {
            $(this)[0].selectedIndex=0;
        });
    });
});

<input type="reset" class="resetButton" />

Answer 4

这将在更改为第一个选项后直接设置每个选项：

    <select onchange="your_selection_func(); this.selectedIndex=0;">

Answer 5

我找到了一些黑客：

<select onchange="doSomething()">
  <option value="a" selected disabled hidden>a</option>
  <option value="a">a</option>
  <option value="b">b</option>
  <option value="…">…</option>
</select>

selected disabled hidden的组合导致（visualy）第一个选项以change事件响应（即使使用相同的value！）。

使用IE，Edge，Opera，Chrome，但不在FF中工作：（

Answer 6

罗恩·罗伊斯顿（Ron Royston）的快速回答（我只在Chrome 74.0上尝试过此操作）

如果该选项被禁用，则无法设置mySelect.selectedIndex = 0;或$('#mySelect').prop("selectedIndex", 0);。

希望这可以节省一些时间和沮丧！

Answer 7

我意识到这有点老了，但想改进teh1的答案。没有理由从＆＃39;这个＆＃39;创建一个jQuery对象。当你刚刚从中抓取DOM元素时：

$(this).closest('form').find('select').each(function() {
    this.selectedIndex = 0;
});

Javascript选择选择列表的第一个选项

7 个答案: