JQuery - 重置切换状态
问题描述:
我有一个按钮,当切换显示/隐藏一个div('.reportOptions'),这工作得很好。JQuery - 重置切换状态
$('.reportOptions').click(function(e){
e.stopPropagation();
});
$('.requestOptions').toggle(
function(){
$(this).parent().find('.reportOptions').css('display','block'); //show request options
},function(){
$('.reportOptions').css('display','none'); //hide all request oprtions menus
}
);
同一div也可以通过点击远离它做隐藏在下面的
$(document).click(function(){
$('.reportOptions').css('display','none');
$('.requestOptions').toggle(even);
});
我有最后一个函数的问题是,如果执行它,我必须双击resuestOptions按钮以再次显示div。
我想知道的是,如果有什么方法可以在不必更改切换功能的情况下重置切换状态。
答
看一看的文档jQuery的切换方法:http://api.jquery.com/toggle/
您可能还需要花点时间通过它进一步理解为有展()和隐藏()方法。您不应该使用css('display','none')来显示和隐藏元素,因为show和hide方法将为您处理所有这些,并且在您阅读代码时不会引起混淆。
我想你可能已经推翻了这种情况。试试这个:
$('.reportOptions').click(function(e){
e.stopPropagation();
});
$('.requestOptions').click(
function(e){
$(this).parent().find('.reportOptions').show(); //show request options
$('.requestOptions').hide(); //hide all request oprtions menus
e.stopPropagation();
}
);
$(document).click(function(){
$('.reportOptions').hide();
$('.requestOptions').show();
});
基本上你要绑定一个click函数来显示div和隐藏的按钮,点击功能,它可以隐藏DIV,并显示该按钮的文档的按钮。点击按钮和div停止传播(这是您之前在按钮中丢失的内容),以便单击这些元素时文档点击处理程序不会触发。
答
不是直接更改CSS,而是添加一个类名(并在CSS中定义它)。然后删除班级名称即可恢复正常。
这是行不通的,我想你可能已经明白我的问题,但感谢尝试反正 – 2012-03-26 20:21:27
诚然,这是一个很难理解你正在尝试你的代码和你的描述之间的事情。你能否更具体一些关于“这不行”?如果我不知道你在想什么做什么或没有工作做,我不能很好地帮助你:P – Brian 2012-03-26 20:22:56
好,你写了一个矛盾的第二个功能,你的表现,然后隐藏.reportOptions div,我基本上想要做的是让切换函数知道.reportOptions div已关闭,因为此刻最后一个函数不会这样做,所以这意味着我必须在执行最后一个函数后双击切换按钮。 – 2012-03-26 20:32:11