Question

在这个例子中，我有5个对话框可以通过将鼠标悬停在缩略图图像和文本链接上来打开。光标离开缩略图图像或文本后，打开的对话框不会关闭 - 它会一直打开，直到光标移动到另一个缩略图或链接上。在打开一个新对话框之前，该函数会检查其他任何一个是否可见，并关闭它们，如果它即将打开的那个已经可见，那么它什么都不做。一切都运行正常，但我计划最多有25个对话框，所以我想缩短代码。有人可以告诉我如何将其转换为数组和迭代，或者jquery each（）函数。我确信它非常简单，但我是新手，无法从文档中找到它。

function Close01() {if($(vid01).is(":visible")){vid01.dialog('close');}}
function Close02() {if($(vid02).is(":visible")){vid02.dialog('close');}}
function Close03() {if($(vid03).is(":visible")){vid03.dialog('close');}}
function Close04() {if($(vid04).is(":visible")){vid04.dialog('close');}}
function Close05() {if($(vid05).is(":visible")){vid05.dialog('close');}}

function Open01() {if($(vid01).is(":visible")===false){ vid01.dialog('open'); vid01.load(content01);}}
function Open02() {if($(vid02).is(":visible")===false){ vid02.dialog('open'); vid02.load(content02);}}
function Open03() {if($(vid03).is(":visible")===false){ vid03.dialog('open'); vid03.load(content03);}}
function Open04() {if($(vid04).is(":visible")===false){ vid04.dialog('open'); vid04.load(content04);}}
function Open05() {if($(vid05).is(":visible")===false){ vid05.dialog('open'); vid05.load(content05);}}

function hovIn01() {Close02(); Close03(); Close04(); Close05(); Open01()}
function hovIn02() {Close01(); Close03(); Close04(); Close05(); Open02()}
function hovIn03() {Close01(); Close02(); Close04(); Close05(); Open03()}
function hovIn04() {Close01(); Close02(); Close03(); Close05(); Open04()}
function hovIn05() {Close01(); Close02(); Close03(); Close04(); Open05()}

function hovOutDoNothing() {}

$('.gallery-01').hoverIntent(hovIn01, hovOutDoNothing);
$('.gallery-02').hoverIntent(hovIn02, hovOutDoNothing);
$('.gallery-03').hoverIntent(hovIn03, hovOutDoNothing);
$('.gallery-04').hoverIntent(hovIn04, hovOutDoNothing);
$('.gallery-05').hoverIntent(hovIn05, hovOutDoNothing);

Answer 1

你不需要阵列。只需给所有对话框一个类（例如popupstyle）。然后你可以关闭所有这些，除了当前的那个：

$(".popupstyle:not(#"+currentId+")").dialog("close");

Answer 2

var arrayOfIds = [];

function closeDialog(dialogId){
    //close the dialog whose ID has been passed
}

function openDialog(dialogId){
    //open the dialog whose ID has been passed
}

function hoverIn(dialogId){
    $.each(arrayOfIds,function(key,val){
         // close everyone else except for the one whose ID has been passed
    });
}

使用数组和迭代或jquery each（）打开一个新对话框并关闭任何其他打开的对话框

2 个答案: