jQuery：从选择下拉列表中显示一个元素，在选择其他选项时隐藏它

我试过环顾四周，也有类似的问题，但我的方法更简单，但是，我在这些论坛中找不到解决方案。

在学习jQuery的同时，我试图在选择选择下拉列表中的项目/选项时显示DIV，并在选择下拉列表中的任何其他选项时隐藏相同的DIV。

选择HTML：

 —Select— Source 1 Source 2 Other  

DIV我需要在选择“其他”时显示：

 
Other source here... 

如果选择了选择菜单中的任何其他选项，则不应显示上述DIV。

我试过这个jQuery，但当然它不能正常工作：

 $(function() { $.viewMap = { 'sother' : $('#specify-source') }; $('#source').change(function() { // hide all $.each($.viewMap, function() { this.hide(); }); // show current $.viewMap[$(this).val()].show(); }); }); 

你能给我的任何帮助，我都非常感激。

谢谢，

Answer 1

我看到你试图用视图做什么。 简化它：

 $('#source').change(function() { ($(this).val() == "sother") ? $('#specify-source').show() : $('#specify-source').hide(); }); 

Answer 2

simplier：

 $(function() { $("#specify-source").hide(); $("#source").change(function(){ if ($(this).val() == "sother") $("#specify-source").show(); else $("#specify-source").hide(); }); }); 

Answer 3

忽略您的视图，您可以：

 $("#source").change(function () { var foo = false; $("#source option:selected").each(function () { if ($(this).val() == "sother") foo = true; }); if (foo) $('#specify-source').show(); else $('#specify-source').hide(); }).change(); 

你想让我包括如何使用你的所有代码吗？

其他已发布的方法也可以使用，但不能使用但不会处理带有@ multiple =“multiple”的选择

Answer 4

我忘了提到我选择“其他”选项时需要显示的DIV，需要在进入页面时隐藏，所以我添加了.hide（）; 属性。

我还添加了一个slideDown（’fast’）; 帮助实现可用性。

这是我最后的代码感谢Amit的帮助：

 $('#specify-source').hide(); $('#source').change(function() { ($(this).val() == "sother") ? $('#specify-source').slideDown('fast') : $('#specify-source').hide(); }); 

Answer 5

这是隐藏元素的最简单方法：

 $('.target').hide(); 

这是show和hide jquery的一个例子：

        Show Hide 
Hello 3,
 
how
 
are
 
you?