[英]enabling and disabling clicks using jquery
I have four buttons which has click able property. 我有四个具有clickable属性的按钮。 Clicking on button will make a div slide down and clicking again on same div should close the div. 单击按钮将使div向下滑动,然后再次单击同一div将关闭div。 I want to add a condition like, when I have a div open, the click property on rest of the three buttons should be disabled, what I did is 我想添加一个条件,例如,当我打开div时,应禁用其余三个按钮上的click属性,我所做的是
for (var i = 1; i <= 4; i++) {
$(".slide" + i).click(function () {
var openTab = $(this).attr('class');
openTab = openTab.replace('slide', '');
var facetGroup = $(this).attr("key");
if ($('#panel').is(':visible')) {
buttonCloser(openTab);
} else {
buttonOpener(openTab, facetGroup);
}
});
}
function buttonCloser(m) {
for (var j = 1; j <= 4; j++) {
if (j != m) {
//alert(j);
$(".slide" + j).bind("click");
} else {
$(".slide" + j).css({
"background-color": " #fff5c3",
"color": "#000000"
});
}
}
$("#panel").slideUp("slow");
}
function buttonOpener(m, n) {
for (j = 1; j <= 4; j++) {
if (j != m) {
$(".slide" + j).unbind("click");
} else {
$(".slide" + j).css({
"background-color": "#293345",
"color": "#fff5c3"
});
}
}
$("#panel").slideDown("slow");
refreshFacet(n);
}
The problem with this code is that the first time I open a div by clicking on slider, the other three click events are disabled, bt when I close that div, it will nt re-enable its click property. 这段代码的问题是,我第一次通过单击滑块打开div时,其他三个click事件被禁用,bt当我关闭该div时,它将不会重新启用其click属性。 so it wont open anything.. 所以它不会打开任何东西..
Without seeing your actual mark-up, I'd suggest that you use simple jQuery, rather than mixing and matching between 'plain' JavaScript and jQuery: 在没有看到实际的标记的情况下,我建议您使用简单的jQuery,而不是在“普通” JavaScript和jQuery之间进行混合和匹配:
var buttons = $('button[class^="slide"]'),
panel = $('#panel');
$(buttons).click(
function() {
var that = $(this);
if (panel.is(':visible')) {
if (that.hasClass('opener')) {
panel.slideToggle();
that.removeClass('opener');
}
else {
return false;
}
}
else {
panel.slideToggle();
that.addClass('opener');
}
});
References: 参考文献:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.