jQuery技术:如何在下拉列表中应用列表filter

Select answer Yes No NA Select answer Yes No NA

这是我的jquery代码..

 $('#a').live('change',function() { Data=$(this).find("option:selected").text(); if(Data == "Yes") { $('#b').find("option[value='1']").show(); $('#b').find("option[value='2']").hide(); $('#b').find("option[value='3']").hide(); } if(Data == "No") { $('#b').find("option[value='3']").hide(); $('#b').find("option[value='1']").show(); $('#b').find("option[value='2']").hide(); } if(Data == "NA") { $('#b').find("option[value='1']").hide(); $('#b').find("option[value='2']").hide(); $('#b').find("option[value='3']").show(); } }); 

我的要求是在第一个下拉列表中仅显示所选项目…

    您已经分配了名为Dat的变量,然后使用if(Data == "Yes")检查它的值

    在这种情况下,通过使用switch语句,根本不容易分配变量

     $('#a').live('change',function() { switch($(this).find("option:selected").text()) { case "Yes": $('#b').find("option[value='1']").show(); $('#b').find("option[value='2']").hide(); $('#b').find("option[value='3']").hide(); break; case "No": $('#b').find("option[value='3']").hide(); $('#b').find("option[value='1']").show(); $('#b').find("option[value='2']").hide(); break; case "NA": $('#b').find("option[value='1']").hide(); $('#b').find("option[value='2']").hide(); $('#b').find("option[value='3']").show(); } }); 

    其他答案是对的,你输入了“Dat”而不是“Data”。 我会建议像:

      var optionStates = { 'Yes': '1', 'No': '1', 'NA': '3' }; Data=$(this).find("option:selected").text(); $('#b') .find("option[value='" + optionStates[Data] + "']") .show() .siblings(':not([value=""])') .hide(); }); 

    这大大减少了数据重复,我认为可以更容易地看到正在发生的事情。 您可以通过更改optionState定义中的值来控制显示哪个选项。 它目前仅支持显示一个项目,根据您的示例,但扩展它以允许多个项目不会是一个巨大的延伸。 (关于拼写错误,我怀疑你想要’不’:’1’实际上是’否”2’。

    至少你应该利用链接并将引用存储到下拉列表的子节点,而不是每次都执行.find()。

    这里的例子 : jsbin例子

      以上就是jQuery教程分享如何在下拉列表中应用列表filter相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/524239.html

      (0)
      上一篇 2020年12月11日
      下一篇 2020年12月11日

      精彩推荐