Javascript 重置所有选择下拉列表_Javascript_Jquery

Javascript 重置所有选择下拉列表

javascript jquery

Javascript 重置所有选择下拉列表,javascript,jquery,Javascript,Jquery,我有一个函数，由onbeforeuload调用。在中，我希望重置所有下拉列表，但我找不到正确的方法将它们重置回0值 <head> <script type="text/javascript"> function displaymessage() { document.getElementsByTagName('select').value = 1; //or document.

我有一个函数，由onbeforeuload调用。在中，我希望重置所有下拉列表，但我找不到正确的方法将它们重置回0值

<head>
    <script type="text/javascript">
        function displaymessage() {
            document.getElementsByTagName('select').value = 1;
            //or
            document.getElementsByTagName('select').options.length = 0;
        }
    </script>
</head>

<body>
    <form>
        <input type="button" value="Click me!" onclick="displaymessage()" />
    </form>

    <select name="data[Rate][15][12][num_rooms]" id="r15ro12">
        <option value="0">0</option><option value="1">1 Rooms</option>
        <option value="2">2 Rooms</option><option value="3">3 Rooms</option><option value="4">4 Rooms</option>
        <option value="5">5 Rooms</option><option value="6">6 Rooms</option><option value="7">7 Rooms</option>
        <option value="8">8 Rooms</option><option value="9">9 Rooms</option>
    </select>

    <select name="data[Rate][15][12][num_rooms]" id="r15ro12">
        <option value="0">0</option><option value="1">1 Rooms</option>
        <option value="2">2 Rooms</option><option value="3">3 Rooms</option><option value="4">4 Rooms</option>
        <option value="5">5 Rooms</option><option value="6">6 Rooms</option><option value="7">7 Rooms</option>
        <option value="8">8 Rooms</option><option value="9">9 Rooms</option>
    </select>
</body>
</html>


函数displaymessage（）{
document.getElementsByTagName（'select'）。值=1；
//或
document.getElementsByTagName（'select'）。options.length=0；
}
01个房间
2个房间3个房间4个房间
5个房间6个房间7个房间
8个房间9个房间
01个房间
2个房间3个房间4个房间
5个房间6个房间7个房间
8个房间9个房间

试试这个：

function displaymessage() {
    $("select").val("0");
}

$( 'select' ).each( function () {
    if ( $( this ).children().length > 0 ) {
        $( $( this ).children()[0] ).attr( 'selected', 'selected' );
    }
} );

比如说：

$(window).unload(function () {
    $("select").val("0");
});

这将选择第一个选项（不一定具有值=0）

对于原始javascript代码，我们可以执行以下操作：

elements = document.getElementsByTagName("select")
for(i=0; i < elements.length ; i++){
 elements[i].selectedIndex= 0;
}

elements=document.getElementsByTagName（“选择”）
对于（i=0；i

这里有一种方法可以使用本机JavaScript选择所有

选择中的第一个选项
var elements = document.getElementsByTagName('select');
for (var i = 0; i < elements.length; i++)
{
    elements[i].selectedIndex = 0;
}

var elements=document.getElementsByTagName（'select'）；
对于（var i=0；i

…但是jQuery非常方便，使大多数事情变得更加简单。
首先，您不应该对不同的标记使用相同的名称/id。它对于每个标签都应该是唯一的
在标记中，调用如下函数：

那就改变你的乐趣吧
函数displaymessage（）{
var x=document.getElementsByTagName（'select'）；
对于（var i=0；i尝试以下方法：
function displaymessage() {
    $("select").val("0");
}

$( 'select' ).each( function () {
    if ( $( this ).children().length > 0 ) {
        $( $( this ).children()[0] ).attr( 'selected', 'selected' );
    }
} );

另一种方式
$('select option:first-child').attr('selected', 'selected');

到目前为止，我看到的jQuery解决方案没有考虑删除前面的selected
属性（如果存在），因此我认为需要执行以下额外步骤：
$("#myControlId").find("select").each(function (index) {
        var ctrl=$(this);       
        if (ctrl.children().length > 0) {
            $(ctrl.children()).each(function(index) {
                if (index===0) $(this).attr('selected', 'selected'); 
                else $(this).removeAttr('selected');
            });
        }
});

此解决方案仅在第一个选项中保留一个选中的属性，并删除所有其他属性（如果适用）。
$（“#dropDownListID”）.val（”
或
$（“#dropDownListID”）.val（“0”）
您不应该有多个元素具有与相同的名称
或id
以及所有表单元素（输入
，选择
等）应该在表单
中。例如，我只是快速复制并粘贴了一份，我的代码中没有它，谢谢您的反馈，cheersOk，太好了！还想知道为什么要重置卸载
上的选择？（假设您关闭弹出窗口）谢谢Fabrizio的帮助，但它没有起作用，meKeith认为它是正确的，只有包含了jQuery库，上面的代码才会起作用。谢谢，我只包含了一个旧版本，现在效果很好。干杯