如何使用 javascript 更改 asp.net DropDownList SelectedValue？答案

【问题标题】：How to change asp.net DropDownList SelectedValue using javascript?如何使用 javascript 更改 asp.net DropDownList SelectedValue？
【发布时间】：2017-12-09 13:21:49
【问题描述】：

我的 asp.net Web 应用项目中有三个下拉列表控件，用户可以从中选择项目。我想要的是用户不能选择相同的值，这意味着在一个下拉列表中选择的值不能在另一个下拉列表中选择，如果用户尝试选择相同的值，我想将 selectedValue 属性重置为那个下拉列表。无论如何我可以使用javascript来实现这一点吗？最好在客户端制作。

谢谢！

下拉列表如下所示：Image here

【问题讨论】：

你是如何渲染你的下拉菜单的？分享一些相关代码。您可以在第一个下拉列表中收听 change 事件并阅读选择并从第二个下拉列表中删除该选项
下拉列表绑定到数据库表。
如果可能，我需要重置所选值。

标签： javascript c# asp.net asp.net-mvc

【解决方案1】：

首先在所有三个下拉列表中添加相同的类名。例如 'class=dropdownClass'
添加下拉数字作为属性三个下拉菜单 -> 'dropdownNo=1' , 'dropdownNo=2' , 'dropdownNo=3'

还要添加 ids（必须不同）-> dropdownId1 , dropdownId2 , 分别为dropdownId3

<script>
 $(document).ready(function () {

$('.dropdownClass').on('change', function () {
    //when ever any dropdown change (class name is same)
    //get the attribe no

    var CurrentdropdownNo = $(this).attr('dropdownNo')
    var CurrentdropdownValue = $(this).val();

    if (CurrentdropdownNo == 1) {
        var value2 =  $('#dropdownId2').val() ;
        var value3 =  $('#dropdownId3').val() ;
       //check with dropdown 2,3
        if (CurrentdropdownValue == value2 || CurrentdropdownValue == value3)
        {
            //reset the current dropdown
            //do stuff here , what you want
        }

   }
    if (CurrentdropdownNo == 2) {
        var value1 = $('#dropdownId1').val();
        var value3 = $('#dropdownId3').val();
        //check with dropdown 1,3
        if (CurrentdropdownValue == value1 || CurrentdropdownValue == value3) {
            //reset the current dropdown
            //do stuff here , what you want
        }
   }
    if (CurrentdropdownNo == 3) {
        var value1 = $('#dropdownId1').val();
        var value2 = $('#dropdownId2').val();
       //check with dropdown 1,2
        if (CurrentdropdownValue == value1 || CurrentdropdownValue == value2) {
            //reset the current dropdown
            //do stuff here , what you want
        }

   }

})

})

注意：根据需要更改类名或 id 名..

【讨论】：

【解决方案2】：

使用每个下拉列表的更改事件
这只是我用于下拉列表的一个更改事件。对其他下拉列表做同样的事情。

var firstDropVal="";
var SecndDropVal="";
var ThrdDropVal ="";


    $("#dropOne").change(function () {

            var firstDropVal = $("#dropOne").val();
           var firstDropVal = $("#dropTwo").val();
          var firstDropVal = $("#dropThree").val();

        if(firstDropVal == SecndDropVal){

         $("#dropOne").val(0)// Or Do what you want to do 
         }


        });

【讨论】：