0
Follow
0
View

The two drop-down boxes use the same set of data, which is mutually exclusive and filtered in the current drop-down box

dengwenlon 注册会员
2023-01-25 18:05

Two dropdown box mutually exclusive implementation of the way is to dynamically generate the drop-down box option, the code is as follows:

一、首先先获取下拉框所有选项的dom元素
var Alloptions = $(".single").clone();
二、
setSelectDisabled(".pairTow", $('.pairOne option:selected').val()); //pairOne为左边下拉框的class;pairTwo为右下拉框calss
function setSelectDisabled(id, selectVal) {
   var oldValue = $(id).val();
   $(id).find('option').remove();
   Alloptions.find("option").each(function(){
      var option = $(this).clone();
      var val = option.attr("value");
      if (oldValue==val) {
         // 默认选择原来的值
         option.attr("selected",true);
      }
      if(option.val()!=selectVal){
         $(id).append(option);
      }
   });
   // 如果当前选择的已经被选择了,那就默认选择第一个了
   if (oldValue==selectVal) {
      $(id).find('option').eq(0).attr("selected",true);
   }
}

With circular assembly, a new mutually exclusive drop-down option can be generated.
Hope to adopt oh!!

About the Author

Question Info

Publish Time
2023-01-25 18:05
Update Time
2023-01-25 18:05