[英]Hide and show multiple div
I'd like to hide and show a div
(jQuery toggle()
). 我想隐藏并显示一个
div
(jQuery toggle()
)。 This is an example of my code: 这是我的代码的示例:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$("a").click(function() {
var myelement = $(this).attr("href");
$(myelement).slideToggle("slow");
$(".toggle:visible").not(myelement).hide(500);
});
</script>
<h2><a href="#box1"> Programming</a></h2>
<div id="box1" class = "block-content" style="display:none">
box 1
</div>
<h2><a href="#box2"> software</a></h2>
<div id="box2" class = "block-content" style="display:none">
box 2
</div>
It doesn't work and Firebug doesn't show me an error message. 它不起作用,Firebug也不会显示错误消息。
Can you help me ? 你能帮助我吗 ?
Demo: http://jsfiddle.net/xyzpq44x/ 演示: http : //jsfiddle.net/xyzpq44x/
preventDefault
you want to prevent default behaviour of a
tag http://api.jquery.com/event.preventdefault/ preventDefault
要阻止的默认行为a
标签http://api.jquery.com/event.preventdefault/ rest should help :)
休息应该有所帮助
:)
try this 尝试这个
$("a").click(function (e) {
e.preventDefault();
var myelement = $(this).attr("href")
$(myelement).slideToggle("slow");
$(".toggle:visible").not(myelement).hide(500);
});
When the script runs, the a tags are not yet present on the page! 当脚本运行时,页面上还没有a标签!
Put your script below the html elements, or use document ready or equivalent to postpone the script execution. 将您的脚本放在html元素下方,或使用准备就绪或等效的文档来推迟脚本执行。
$(".toggle:visible").not(myelement).hide(500);
将“ .toggle:visible”替换为“ div”
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.