Question

这应该很容易......但是我花了大部分时间试图解决这个问题。使用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>

我已经完成了对选择的淡入淡出，但它会立即消失。

Answer 1

看起来不支持淡化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>

Answer 2

我希望你为了简单起见省略td标签，否则它根本就不是一个有效的HTML。我真的不明白为什么你需要使用一个表而不是div。

无论如何，在你的td标签中必须显示文本，将该文本放在div中，然后给它一个id“new_author”（从tr标签中删除该id）。

另外，不要在tr标签之间放置脚本。在关闭身体标签之前将其放在头部或右侧。

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

2 个答案: