基于菜单选择的简单div隐藏或显示

如何解决基于菜单选择的简单div隐藏或显示

| 这应该很容易...但是我一天中的大部分时间都在尝试解决。使用jQuery：代码如下：

<tr> 
  <select name=\"exist_author\" class=\"exist_author\">     
     <option value=\"select\">Select</option>
     <option value=\"new_auth\">I cant find my author</option>
     <option value=\"2\">Tom Wolf</option>
     <option value=\"1\">Frank Baum</option> 
  </select>
</tr>       

<script type=\"text/javascript\">         
  $(document).ready(function(){             
     $(\"#new_author\").css(\"display\",\"none\");             
     $(\".exist_author\").change(function(){
         var test = $(this).val();
         if(test !== \'new_auth\') {
            $(\"#new_author\").fadeOut(\"slow\");       
         } 

         else {
            $(\"#new_author\").fadeIn(\"slow\");        
         }
     });
  });
</script>

<tr id=\"new_author\">Text to Show on \'I cant find my author\' menu selection</tr>

我已经淡入淡出以进行选择，但是它立即淡出了。

解决方法

似乎不支持TR的淡入淡出，请尝试以下操作：

<html>
<head>
<script src=\"jquery.js\"></script>
<script type=\"text/javascript\">         
  $(document).ready(function(){             
     $(\"#new_author\").css(\"display\",\"none\");             
     $(\".exist_author\").change(function(){
         var test = $(this).val();
         if(test !== \'new_auth\') {
            $(\"#new_author\").fadeOut(\"slow\");       
         } 

         else {
            $(\"#new_author\").fadeIn(\"slow\");        
         }
     });
  });
</script>

</head>
<body>

<table>
<tr><td>
  <select name=\"exist_author\" class=\"exist_author\">     
     <option value=\"select\">Select</option>
     <option value=\"new_auth\">I cant find my author</option>
     <option value=\"2\">Tom Wolf</option>
     <option value=\"1\">Frank Baum</option> 
  </select>
</td><td>
<table>
<tr ><td id=\"new_author\" style=\"color:red\">this one</td></tr>
<tr id=\"test1\"><td>content</td></tr>
<tr id=\"test2\"><td>content</td></tr>
</table>
</td></tr></table>
</body>
</html>

,我希望您为了简单起见省略td标签，否则它不是有效的html。而且我真的不明白为什么您根本不需要使用表而不是使用div。无论如何，在必须显示文本的td标签中，将该文本放在div中，并为其指定id \“ new_author \”（从tr标签中删除该ID）。另外，不要在tr标签之间放置脚本。将其放在头部或关闭身体标签之前。

基于菜单选择的简单div隐藏或显示

如何解决基于菜单选择的简单div隐藏或显示

解决方法

相关推荐