Question

我的网页中有4个下拉列表元素。我打算找到所有这些并改变他们的＆＃39; selectedIndex＆＃39;一次到0 。

目前，我正在执行以下操作：

$("#ddl1")[0].selectedIndex = 0;
$("#ddl2")[0].selectedIndex = 0;
$("#ddl3")[0].selectedIndex = 0;
$("#ddl4s")[0].selectedIndex = 0;

虽然这段代码完美无缺，符合我的要求，但在这里我必须单独选择它们。

如何一次选择所有这些并将其索引更改为0。

例如，我在为文本框做同样的事情时取得了成功。

这就是我的所作所为：

$('input[type="text"]').val('');

这会立即清除所有文本框值。

使用相同的方法我尝试了以下内容：

$('input[type="text"]')[0].selectedIndex(0);

还有这个

$('input[type="text"]')[0].selectedIndex = 0;

但它没有用。

我做错了什么？如何实现这一目标？

Answer 1

使用下面的代码

$("select").each(function(){
    $(this).prop("selectedIndex", 0);
});

Answer 2

下拉列表html标记是＆＃34;选择＆＃34;元素，而不是＆＃34;输入＆＃34;元件。
您应为每个下拉列表添加name属性（例如name =＆＃34; abc1＆＃34;）

使用以下代码：

$("select[name^='abc']").attr('selectedIndex', 0)

name ^表示名称属性，例如has＆＃39; abc＆＃39;如果下拉列表名称属性包含abc字符，则所有这些下拉列表都将生效。

Answer 3

试试这个：
$("select").prop("selectedIndex", 0);

您可以使用公共选择器，例如class ...

$('#id-btn').click( function() {
    $("select").prop("selectedIndex", 0);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p><label class="custom-select">
    Select your favorite food:
    <select>
        <option>Sushi</option>
        <option>Blue cheese with crackers</option>
        <option>Steak</option>
        <option>Other</option>
    </select>
</label></p>
<p><label class="custom-select">
    Select your favorite food:
    <select>
        <option>Sushi</option>
        <option>Blue cheese with crackers</option>
        <option>Steak</option>
        <option>Other</option>
    </select>
</label></p>
<p><label class="custom-select">
    Select your favorite food:
    <select>
        <option>Sushi</option>
        <option>Blue cheese with crackers</option>
        <option>Steak</option>
        <option>Other</option>
    </select>
</label></p>
<p><label class="custom-select">
    Select your favorite food:
    <select>
        <option>Sushi</option>
        <option>Blue cheese with crackers</option>
        <option>Steak</option>
        <option>Other</option>
    </select>
</label></p>
<input type="button" id="id-btn" value="Button">

Answer 4

使用jquery starts with属性选择器

$('[id^=ddl]')[0].selectedIndex = 0;

替代解决方案 -

一致的解决方案是为每个下拉元素添加一个公共类。使用

$('.commonDropDownClass')[0].selectedIndex = 0;

但如果html标记不在您的手中，您可以使用第一个标记。因某种原因不能改变它。

如何从下拉列表元素中查找和清除所有选定的值

4 个答案: