我正在使用以下脚本在点击时切换打开和关闭 div:
(function ($) {
$.fn.showHide = function (options) {
//default vars for the plugin
var defaults = {
speed: 1000,
easing: '',
changeText: 0,
showText: 'Show',
hideText: 'Hide',
};
var options = $.extend(defaults, options);
$(this).click(function () {
// this var stores which button you've clicked
var toggleClick = $(this);
// this reads the rel attribute of the button to determine which div id to toggle
var toggleDiv = $(this).attr('rel');
// here we toggle show/hide the correct div at the right speed and using which easing effect
$(toggleDiv).slideToggle(options.speed, options.easing, function() {
// this only fires once the animation is completed
if(options.changeText==1){
$(toggleDiv).is(":visible") ? toggleClick.text(options.hideText) : toggleClick.text(options.showText);
}
});
return false;
});
};
})(jQuery);
在打开下一个 div 之前自动关闭任何当前打开的 div 的最佳方法是什么(以防止所有在页面上打开 - 只有点击的链接可见)
HTML 如下:
<a href="#" class="show_hide" rel="#slidingDiv">View</a><br />
<div id="slidingDiv" style="display:none;">
Fill this space with really interesting content.
</div>
<a href="#" class="show_hide" rel="#slidingDiv_2">View</a><br />
<div id="slidingDiv_2" style="display:none;">
Fill this space with really interesting content.
</div>
我猜只是在 open 被触发之前进行快速检查 - 但到目前为止我无法让它工作。
非常感谢!
最佳答案
向所有滑动 div 添加一个 slidingDivs
类并简单地调用:
$(".slidingDivs").hide();
我认为只隐藏可见的不值得担心,只需将它们全部隐藏即可。
关于javascript - 切换 div 打开和关闭 - 确保任何时候只有一个 div 可见,而不是全部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7602445/