简单的div隐藏或基于菜单选择显示
问题描述:
这应该很容易......但我花了一天的更好的一部分试图弄清楚。使用jQuery:该代码是这样的:简单的div隐藏或基于菜单选择显示
<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标签中删除该标识)。
另外,不要在tr标签之间放置脚本。可以将它放在头部或右边,然后关闭身体标记。
+0
问题解决。 select类“exist_author”也是父类标记的类。这是什么导致事情出现后立即消失。非常感谢您的帮助! – 2011-05-27 00:07:55
我们需要看看你的标记是什么样的。 – 2011-05-25 22:50:55
我试过你js脚本,它工作得很好。也许的确你有一些布局问题。 – 2011-05-25 23:02:32
我道歉...第一次发布。格式很糟糕。我修改了。 – 2011-05-25 23:18:26