Question

我的mvc4 razor页面上有一个复选框和一个下拉列表

当我取消选中我的复选框时，我需要将我的下拉列表选项重置为0

$("#chkProcess").click(function (event) {
        //on-click code goes in here.
        var chkProcess = $(this);
        if (chkProcess.is(':checked')) {
           //do process
        } else {
            $('#locationSelectList').val('0');
            alert("" + $("#locationSelectList option:selected").val());

        }
    });

当我取消选中我的复选框时，我收到显示所选索引= 0的警报，但在屏幕上它实际上并未反映更改。但是我需要下拉菜单来重置屏幕上的选择。为什么我看到这种行为，我在这里做错了什么？

我在_layout页面上引用了这些Jquery文件

    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.treeview.js")" type="text/javascript"></script>
     <script src="@Url.Content("~/Scripts/jquery.ui.selectmenu.js")" type="text/javascript"></script>

    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

我尝试了所有这些

$('#locationSelectList').attr('selectedIndex', '0');
 $('#locationSelectList').val('0');

但我可以在警告信息中看到它重置所选索引，但在页面上没有反映出来。

Answer 1

查看此链接。

http://jsfiddle.net/sheeban/wGAMW/2/

<强> HTML

<input type="checkbox" id="chkProcess"/>
<select id="locationSelectList">
    <option value="chennai">chennai</option>
    <option value="bangalore">bangalore</option>
</select>

<强> JS

$(function() {
$("#chkProcess").click(function (event) {
    if(!$(this).is(':checked')) { 
        $('#locationSelectList').prop('selectedIndex',0);
    } 
 });
});

Answer 2

选择第一个选项（默认选择选项）？

试试这个：

document.getElementById("<%#mydropdownlist.ClientID%>").value = 0;

使用Jquery

的另一种方法

$check .click(function() {

    $ddlHeader.find('option:first').prop('selected', 'selected');

});

我有 FIDDLE

Answer 3

使用。prop功能：

$("#chk").on("click", function()
{
    if($(this).prop("checked"))
    {
        $('#locationSelectList').val('0');
    }
});

http://jsfiddle.net/hescano/BDh6X/1/

Jquery重置dropdownlist的选定索引不起作用

3 个答案: