JavaScript Any Number 사용

Question

나는 라이트 박스가 이미 처리되어있는 것을 좋아하지 않기 때문에 사용자 정의 라이트 박스 시스템을 구축 중이며 라이트 박스가 이미 열려 있는지 여부를 감지하는 방법이 필요합니다.

는 내가 뭘하고 싶은 것은 이것이다 : 나는

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

이 있다면 내가 하나가 감지 할 수 있도록 ##는, 임의의 두 숫자의 조합을 나타냅니다

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

그들 중 하나가 보여주고있다, 그리고 있다면, 다른 하나를 열지 마십시오.

편집 : jQuery를 사용하지 않는 것이 좋을 것 같습니다. 그리고 이것은 내가 얻고있는 답변 중 일부보다 훨씬 쉬워야하는 것처럼 보입니다. 나는 그것을 변화시키기 위해 무엇이든 바꿀 수 있습니다.이 클래스 나 ID 중 어느 것도 최종적이지 않습니다.

편집 2 : 이렇게하는 것이 훨씬 간단합니다. 내가 글로벌 var lb = 0;을 설정하고 그 변수의 값을 찾는다. 0이면 함수를 실행하고 값을 1로 변경한다. closing 함수를 실행하면 다시 값이 0으로 바뀐다. 하나 이상의 열기가있는 것에서, 미친 JS 물건들 없이는 나에게주는거야.

기본적으로 코드는 이제 다음과 같이 보이며 원하는대로 작동합니다.

Answer 1

옵션 1 : 클래스 이름과 일 :

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

옵션 2 : 오픈/당신이 지정할 수있는 상자를 닫습니다/isOpen 같은 속성을 변경하는 경우는

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

Answer 2

클래스 또는 (옵션 인 경우) jQuery을 사용하십시오.

Answer 3

jQuery가 좋은 옵션입니다. 이 라인을 따라 뭔가 당신이

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

이 방법은 단 한 번에 활성화 될 것입니다 ... 가고있는 무슨 수 있습니다. 이는 단지 기본 개념 일 뿐이므로 코드가 DOM 구조에 따라 더 복잡 할 것입니다.

Answer 4

나는 "라이트"를 싫어 효과 - 개발자가 내가보고 싶다고 생각한 일부 애니메이션 (두 번째 또는 세 번째 시간 이후에 이 실제로 인 경우)을 보는 동안 페이지 콘텐츠가 흐려져 이미지를 볼 때까지 기다리게합니다. 그들을 괴롭힌다.

div에 대한 참조를 저장하는 객체를 만든 다음 상태에 따라 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,' '); 
} 

사용하면 전역으로 그들을 원하지 않는 경우.