我想要实现的是在使用jQuery打开其他DIV(单击打开)时关闭一个DIV。以下是HTML结构。
我也很想知道,在这种情况下,是否可以使用单个函数控制多个DOM元素。
HTML结构
<div class="region-selection">
<div class="region-search"><h6>REGION</h6></div>
<div class="region-dropdown"></div>
</div>
<div id="top-login">
<a href="#" class="top-register"><span>REGISTER</span></a>
<div class="company-registration-modal"></div>
</div>
在这里,点击课程.region-search
及其子项后,我可以将区域下拉列表向下滑动。我也可以获得公司注册模型以点击打开。但是,当第一个DIV处于活动状态时,当我单击第二个DIV时,第一个DIV保持活动状态。我需要关闭它。
我也尝试使用相同的jQuery函数来控制这两个DOM。可能吗?
jQuery如下
$(document).ready(function(){
var $registration_dropdown=$('.company-registration-modal');
var $registration_link=$('.top-register span, .fa-registered');
$registration_dropdown.hide();
$registration_link.on('click touchend', function(event){
var target = $(event.target);
if(target.is($registration_link)){
$registration_dropdown.slideToggle(300);
event.stopPropagation();
}
});
$(document).click(function(e) {
if ($(e.target).closest($registration_dropdown).length===0) {
$($registration_dropdown).slideUp(300);
}
});
$registration_dropdown.mouseleave(function(){
$(this).delay(400).slideUp(300);
});
});
同样,我为第二个DIV写了不同的函数。