语义下拉有问题.
我一直在使用Semantic-Ui,并希望动态更改下拉项.
也就是说,当我从第一个下拉列表中选择值时,第二个下拉列表的项目将会更改.
但问题是,当项目发生变化时,无法选择第二个下拉列表,
价值不会改变.下拉列表不会倒退.
第一次下拉
<div id="programmetype" class="ui fluid selection dropdown"> <input type="hidden" name="programmetype"> <div class="text">Choose..</div> <i class="dropdown icon"></i> <div class="menu"> <div class="item" data-value="val1">Car</div> <div class="item" data-value="val2">Tank</div> <div class="item" data-value="val3">Plane</div> </div> </div>
第二次下拉
<div id="servicetype" class="ui fluid selection dropdown"> <input type="hidden" name="servicetype"> <div class="text">Choose..</div> <i class="dropdown icon"></i> <div class="menu"> <div class="item" data-value="select">Choose..</div> </div> </div>
……………………..
jQuery
$("#programmetype").dropdown({ onChange: function (val) { if (val == "val1") { $('#servicetype .menu').html( '<div class="item" data-value="val1">Saloon</div>' + '<div class="item" data-value="val2">Truck</div>' ); }; if (val == "val2") { $('#servicetype .menu').html( '<div class="item" data-value="val1">Abraham</div>' + '<div class="item" data-value="val2">Leopard</div>' + ); }; if (val == "val3") { $('#servicetype .menu').html( '<div class="item" data-value="val1">Jet</div>' + '<div class="item" data-value="val2">Bomber</div>' + ); }; } });
解决方法
找到了,
ZZZZ
ZZZZ
我把$(‘#servicetype’).dropdown();
在分配值之后.
$("#programmetype").dropdown({ onChange: function (val) { if (val == "fertility") { $('#servicetype').dropdown({'set value':'shit'}); $('#servicetype .menu').html( '<div class="item" data-value="acp">ACP</div>' + '<div class="item" data-value="art">ART</div>' ); $('#servicetype').dropdown(); }; });