.slideToggle() 检查
我得到了一个菜单，里面有不同的滑动切换按钮。 javascript 看起来像这样：
$('.toggler').live('click',function(){
$(this).parent().children().toggle(); //swaps the display:none between the two spans
$(this).parent().parent().find('.toggled_content').slideToggle(); //swap the display of the main content with slide action
$(this).parent().parent().find('.toggled_content2').css('display', 'none');
$(this).parent().parent().find('.div2').css('display', 'none');
$(this).parent().parent().find('.ap2').css('display', 'block');
$(this).parent().parent().find('.toggled_content3').css('display', 'none');
$(this).parent().parent().find('.div3').css('display', 'none');
$(this).parent().parent().find('.ap3').css('display', 'block');
$(this).parent().parent().find('.toggled_content4').css('display', 'none');
$(this).parent().parent().find('.div4').css('display', 'none');
$(this).parent().parent().find('.ap4').css('display', 'block');
});
现在你可以看到，一旦我单击 .toggler，他就会将某些区域设置为显示：无，并将某些区域设置为显示：阻止。但是，如果我可以替换这部分代码，那就更完美了：
$(this).parent().parent().find('.toggled_content2').css('display', 'none');
对于一些检查块是否打开的代码，是的，那么它会滑动以关闭它。我不知道这是否可行，但如果可行的话看起来会更好。
感谢转发！
这是 HTML：
<div id="spacerouter"><div id="spacer"><div id="spacerin"></div><div id="spacerinr"></div></div></div>
<div class='toggleHolder'>
<div id="company" class='toggler ap1'>
<div id="companysiton"></div>
<div id="companyname">
<h1>Siton Suzenaar</h1>
<h2>Hyundai / Opel / Chevrolet</h2>
</div><!-- companyname -->
</div><!-- company -->
<div id="company2" class='toggler div1' style='display:none;'>
<div id="companysiton"></div>
<div id="companyname">
<h2>Hyundai / Opel / Chevrolet</h2>
</div><!-- companyname -->
</div><!-- company -->
</div><!-- toggleHolder -->
<div class='toggled_content' style='display:none;' id="toggled_content">
<h3>
</h3>
<h3>
<a href="mailto:[email protected]">[email protected]</a><br />
</h3>
</div>
I got an menu with different slidetoggles in it. the javascript looks like this:
$('.toggler').live('click',function(){
$(this).parent().children().toggle(); //swaps the display:none between the two spans
$(this).parent().parent().find('.toggled_content').slideToggle(); //swap the display of the main content with slide action
$(this).parent().parent().find('.toggled_content2').css('display', 'none');
$(this).parent().parent().find('.div2').css('display', 'none');
$(this).parent().parent().find('.ap2').css('display', 'block');
$(this).parent().parent().find('.toggled_content3').css('display', 'none');
$(this).parent().parent().find('.div3').css('display', 'none');
$(this).parent().parent().find('.ap3').css('display', 'block');
$(this).parent().parent().find('.toggled_content4').css('display', 'none');
$(this).parent().parent().find('.div4').css('display', 'none');
$(this).parent().parent().find('.ap4').css('display', 'block');
});
Now u can see that once i click an .toggler he sets certain area's to display:none and some to display:block. But what would be more perfect if i can replace this part of code:
$(this).parent().parent().find('.toggled_content2').css('display', 'none');
To some code that checks if the block is open and so yes then it slides to close it. I don't know if this is possible but it would look nicer if it does.
Thanks in forwards!
Here is the HTML:
<div id="spacerouter"><div id="spacer"><div id="spacerin"></div><div id="spacerinr"></div></div></div>
<div class='toggleHolder'>
<div id="company" class='toggler ap1'>
<div id="companysiton"></div>
<div id="companyname">
<h1>Siton Suzenaar</h1>
<h2>Hyundai / Opel / Chevrolet</h2>
</div><!-- companyname -->
</div><!-- company -->
<div id="company2" class='toggler div1' style='display:none;'>
<div id="companysiton"></div>
<div id="companyname">
<h2>Hyundai / Opel / Chevrolet</h2>
</div><!-- companyname -->
</div><!-- company -->
</div><!-- toggleHolder -->
<div class='toggled_content' style='display:none;' id="toggled_content">
<h3>
</h3>
<h3>
<a href="mailto:[email protected]">[email protected]</a><br />
</h3>
</div>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您可以使用可见的 &隐藏选择器并向所有需要切换的元素添加一个公共类。
或者更好
You could use the visible & hidden selectors and add a common class to all your elements that need to be toggled.
Or better yet