Question

我的问题是如何在C＃中为同一功能在同一页面上显示多个下拉列表。让我们说我在页面上有3个面板，我想在所有三个面板中显示一个下拉菜单，但是更改一个下拉菜单的值也会导致更改其他面板的值。我不能在JS中使用id访问，因为如果同一ID的同一页面上有3个下拉列表，即ID不是唯一的，那么Java Script就无法执行操作。

Answer 1

只需将相同的类应用于所有下拉列表，并在更改任何下拉列表时将该值设置为所有下拉列表，请在下方找到摘录。

＆＃13;

$(".selectclass").on("change",function(){
   $(".selectclass").val($(this).val());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="selectclass">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
<select class="selectclass">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
<select class="selectclass">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

＆＃13;

Answer 2

您可以为所有三个下拉列表和呼叫更改事件分配不同的类

  <select id="ddlUnquie" class="one" >
<option value="firstvalue">first dropdown text</option>
<option value="firstsecond">first second text</option>
</select>
 <br>
<br>
  <select id="ddlUnquie" class="two" >
  <option value="firstvalue">first dropdown text</option>
<option value="firstsecond">first second text</option>
</select>
<br>
<br>
 <select id="ddlUnquie" class="three" >
<option value="firstvalue">first dropdown text</option>
<option value="firstsecond">first second text</option>
</select>

下面是Jquery代码

$(".one").change(function()
  {
    alert($(this).val());
  })
   $(".two").change(function()
    {
    alert($(this).val());
   })
  $(".three").change(function()
     {
       alert($(this).val());
    })

您也可以使用jsfillde link https://jsfiddle.net/1xzkmbtk/

同一页面上相同功能的多个下拉列表

2 个答案: