JQuery와 한 각각의 클릭 이벤트

에 의해 사업부를 표시하려면이 내 코드입니다 : 내가 DIV 클릭 할 때마다 이벤트 하나씩 있지만 작동하지를 표시하기 위해 필요한이 코드에서JQuery와 한 각각의 클릭 이벤트

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('.toAdd').hide(); 
     $('#add').click(function() { 
      var i = 0; 
      $('.toAdd').each(function() { 
       if ($(this).show()) { 
        i++; 
       } 
      }); 
     }); 
    }); 
    </script> 

    <div id=add><input type="button" value="click"/> 
    </div> 
    <div id="toAdd"> 
    <label>1</label> 
    </div> 
    <div id="toAdd"> 
    <label>2</label> 
    </div> 
    <div id="toAdd"> 
    <label>3</label> 
    </div> 
    <div id="toAdd"> 
    <label>4</label> 
    </div>

? 클래스로 div의 변화 ID = "TOADD"에서

출처

2013-09-02 Saravanan M P

먼저 ID입니다 올 수도, 당신은 jQuery를의 클래스로 사용했다. '.'대신 '#'을 사용하십시오. –

사실,'id' 대신'class'를 사용하십시오. –

예 변경되었지만 전체 부서가 단일 클릭 이벤트에 해당하지 않음 –

ID를 할 대신 클래스. 다른 사람이 말했듯이

$('.toAdd').hide(); 

var count = 0; 
$('input').on('click',function(){ 
    $('.toAdd:eq('+count+')').show(); 
    count++; 
});

는

JSFiddle

출처

2013-09-02 08:03:07 Vucko

': eq' 앞에는 공백이 없어야합니다. – Barmar

@Barmar 예, 오타입니다. Txx – Vucko

= "TOADD"

출처

2013-09-02 07:59:54 syned

는 를 사용 <div id="toAdd"> with <div class="toAdd">

를 교체하고이 독특한해야이

$('.toAdd').each(function() { 
       if (!$(this.is(":visible"))) { 
        $(this).show(); 
        break; 
       } 
      });

출처

2013-09-02 08:02:27

모든 div가 표시되지 않습니까? 그리고 왜 휴식? – ygesher

아니요, div가 숨겨져 있는지 확인합니다. 숨겨져 있다면 그것을 볼 수 있습니다. 하나의 div 만 보일 수 있기 때문에 break가 사용됩니다 !!! –

그것에 대해 아주 어색한 방법처럼 보입니다. 나는 다른 대답들을 훨씬 더 좋아한다. – ygesher

, 당신은`클래스 = "TOADD"에 id="toAdd"을 변경해야합니다. 다른 말한 것처럼, 클래스에

$('#add input').click(function() { 
     $('.toAdd:hidden:first').show(); 
    });

FIDDLE

출처

2013-09-02 08:06:25 Barmar

매우 우아! 나는 +1을 준다! – ygesher

변화 ID와 사용자가주기 표시/숨기기를해야하는 경우 :

당신은 다음과 첫 숨김 DIV를 표시 할 수 있습니다. 다음이 모든 'TOADD'의 편리한

$('.toAdd').hide(); 
var i = 0; 
$('#add input').click(function() { 
    i=(i >= 4)?0:i; 
     //or if(i >= 4){ i=0;} 
    $('.toAdd').eq(i).show().siblings().not(':first').hide(); 
    i++; 

});

fiddle here

출처

2013-09-02 08:11:43 bipen

JQuery와 한 각각의 클릭 이벤트

답변

관련 문제