JavaScript使用任何数字

我正在建立一个自定义的lightboxing系统（因为我不喜欢那里的任何处理它），我需要一种方法来检测灯箱是否已经打开。JavaScript使用任何数字

我想要做的是这样的：

if (getElementById("lb" + ##).clientHeight > 0) { 
    // do nothing 
} else { 
    // execute code 
}

凡##代表任意两个数字的任意组合，因此，如果我有

<div class="lightbox" id="lb01"> 
    <!-- empty --> 
</div> 
<div class="lightbox" id="lb02"> 
    <!-- empty --> 
</div>

我可以，如果一个检测他们正在展示，如果是，则不打开另一个。

编辑：我真的不喜欢使用jQuery，这似乎应该比我得到的一些答案更容易。我愿意改变任何事情使其发挥作用，这些类或ID都不是最终的。

编辑2：想出了一个更简单的方法来做到这一点。我设置了一个全局变量var lb = 0;，然后检测该变量的值，如果它等于0，它将运行该函数并将该值更改为1.当我运行闭合函数时，它将该值更改为0。从不止一个开放，没有你们给我的那些疯狂的JS东西。

基本上，代码现在看起来像这样，并且完全像我想要的那样工作。

var lb = 0; 

function lightbox(id) { 
    if (lb == 0) { 
    lb = 1; 
    } else { 
    // do nothing 
    } 
} 

function hideme(id) { 
    lb = 0; 
}

来源

2011-04-27 JacobTheDev

跟踪数组中的所有div元素都可以考虑... – Varun 2011-04-27 03:44:24

[对JQUERY的抵抗力很强] – 2011-04-27 04:17:13

@Ates Goral你打算让jquery-women穿一个'$（'＃niqab'）'，我们都必须为'$（'。Resigprayers'）'祈祷'一天一次？ – KooiInc 2011-04-27 04:47:03

选项1：如果你打开/关闭一个盒子，你可以指定/更改像isOpen属性：

[boxelement].isOpen = true/false 
if ([boxelement].isOpen) { }

选项2：工作与类名：

[boxelemnt].className += ' open'; 
if ([boxelement].className.match(/open/i)) { } 
//on close 
[boxelement].className = [boxelement].className.replace(/open/i,'');

来源

2011-04-27 04:42:42 KooiInc

这就是我最终使用的，但有点不同。我把我在原来的帖子中使用的东西放进去。 – JacobTheDev 2011-04-27 16:07:38

使用类，或（如果它是一个选项）jQuery。

来源

2011-04-27 03:40:37 mattsven

如何用JS修改类？我所能找到的信息都是ID。 – JacobTheDev 2011-04-27 03:41:49

要遍历灯箱获取它们的ID：'var lbs = document.getElementsByClass（“lightbox”）; for（var i = 0; i mattsven 2011-04-27 03:43:53

我觉得这太疯狂了，过于复杂。应该有一个更简单的方法来做到这一点... – JacobTheDev 2011-04-27 03:49:20

jQuery是一个不错的选择。沿着这些线路的东西可能是你要去...

$('.lightbox').click(function() { 
    $('.lightbox').removeClass('.active'); //remove from all .lightbox 
    $(this).addClass('.active'); //add .active to the current element 
}

这样一次只有一个将被激活一次。这只是基本的想法，根据您的DOM结构，您的代码可能会更复杂。

来源

2011-04-27 03:55:33 wdm

讨厌 “收藏夹”效果 - 他们模糊了页面内容，让我等待看到图像，同时观看开发人员认为我希望看到的一些动画（在第二次或第三次之后这是真的 annonying） - 所以在dep爱他们。

创建一个对象来存储对div的引用，然后根据它们的状态给它们一个className。要查看一个或两个是否“活跃”，请检查他们是否具有活动状态类。在使其处于活动或休眠状态时，请设置适当的课程。

一些简单的className实用功能：

function hasClassName(el, cName) { 

    if (typeof el == 'string') el = document.getElementById(el); 

    var re = new RegExp('(^|\\s+)' + cName + '(\\s+|$)'); 
    return el && re.test(el.className); 
} 

function addClassName(el, cName) { 

    if (typeof el == 'string') el = document.getElementById(el); 

    if (!hasClassName(el, cName)) { 
     el.className = util.trim(el.className + ' ' + cName); 
    } 
} 

function removeClassName(el, cName) { 

    if (typeof el == 'string') el = document.getElementById(el); 

    if (hasClassName(el, cName)) { 
     var re = new RegExp('(^|\\s+)' + cName + '(\\s+|$)','g'); 
     el.className = trim(el.className.replace(re, '')); 
    } 
} 

function trim(s) { 
    return s.replace(/(^\s+)|(\s+$)/g,'').replace(/\s+/g,' '); 
}

使用与模块模式或什么，如果你不想让他们为全局。

来源

2011-04-27 06:48:45 RobG

重点不在于大量内容处于疯狂的灯箱中，我只是希望他们展示某些图片的较大版本，而不是打开新标签并将用户带离该网站。我也不太关心灯箱，但它比打开一个新标签和混淆不熟悉电脑的人更好。 – JacobTheDev 2011-04-27 14:37:24

JavaScript使用任何数字

回答

相关问题