打开另一个DIV时关闭一个DIV（JQUERY点击功能） [英] Close one DIV while opening the other DIV (JQUERY click function)
问题描述
我想要实现的是在使用JQUERY打开其他DIV（单击打开）时关闭一个DIV。我是JAVASCRIPT / JQUERY的初学者。以下是HTML结构。
我也有兴趣知道，在这种情况下，是否可以使用单个函数控制多个DOM元素。
HTML结构
What I am trying to achieve is to close one DIV when other DIV is opened (click open) with JQUERY. I am a beginner in JAVASCRIPT/JQUERY. Following is the HTML structure.
I am also interested to know if, in this case multiple DOM elements can be controlled with a single function.
HTML Structure
REGION
REGISTER
< br $> b $ b
点击类.region-search及其子项，我可以让区域下拉列表向下滑动。我也可以获得公司注册模型以点击打开。但是，当第一个DIV处于活动状态时，当我单击第二个DIV时，第一个DIV保持活动状态。我需要关闭它。我该怎么做？。请帮助我。
我也试图使用相同的JQUERY函数来控制两个DOM。可能吗？请指教。
JQUERY如下
$（文件）.ready（function（） {
var $ registration_dropdown = $（'。company-registration-modal'）;
var $ registration_link = $（'。top -register span，.fa-registered'）;
$ registration_dropdown.hide（）;
$ registration_link.on（'click touchend '，功能（事件）{
var target = $（event.target）;
if （target.is（$ registration_link））{
$ registration_dropdown.slideToggle（300）;
event.stopPropagation（）;
}
}）;
$（文件）.click（函数（e）{
if（$（ e.target）.closest（$ registration_dropdown）。length === 0）{
$（$ registration_dropdown）.slideUp（300）;
}
}）;
$ registration_dropdown.mouseleave（function（）{
$（this）.delay（400）。效果基本show（30 0）;
}）;
}）;
同样，我为第二个DIV写了一个不同的函数。
我试过的：
$（文件）.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（）;
}
}）;
$ （文件）.click（function（e）{
if（$（e.target）.closest（$ registration_dropdown）。length === 0）{
$ （$ registration_dropdown）.slideUp（300）;
}
}）;
$ registration_dropdown.mouseleave（function（）{
$（this）.delay（ 400）.slideUp（300）;
}）;
}）;
Here on clicking the class .region-search and its children, I could get the region-dropdown to slide down. I could also get the company registration model to click open as well. However, when the first DIV is active, when I click the second DIV, the first one remains active. I need to close it. How can I do it?. Please assist me.
I am also trying to use the same JQUERY function to control both DOM. Is it possible? Please advise.
The JQUERY is as follows
$(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);
});
});
Similarly, I write a different function for the second DIV.
What I have tried:
$(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);
});
});
推荐答案
（document）.ready（function（）{
var
(document).ready(function(){
var
registration_dropdown =
registration_dropdown=
（'。company-registration-modal'）;
var
('.company-registration-modal');
var
这篇关于打开另一个DIV时关闭一个DIV（JQUERY点击功能）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
