2012-04-02 2 views
0

내 함수에서 click 이벤트를 객체에 추가하는 동안 두 번 호출합니다. 나는 찾지 못했다. 형태의 해결책은 없었지만 아무런 도움이되지 못했습니다.jquery click 이벤트 호출 2 번

누구든지이 문제를 해결할 수 있습니까?

내 코드 :

function accordionOptions(AccordionBox, AccordionSec) { 
    var accordionBox = AccordionBox, 
     accordionSec = AccordionSec; 

    $.each(accordionSec, function (i, values) { 
     $('h3', values).each(function() { 
      $(this).unbind('click').bind('click', function() { 
       $(this).toggleClass('selected').siblings('.expand-area').slideToggle().end().parent().siblings().children('h3').removeClass('selected').siblings('.expand-area').slideUp(); 

       var subSec = $(this).parent().children().find('.subSec'); 

       $(subSec).click(function() { 
        console.log(this.tagName); // i am getting 2 times...why? 
       }) 

      }); 
     }) 
    }) 

} 

$(document).ready(function() { 
    var accordionBox = $('#Accordion'), 
     accordionSec = { 
      accorIndice: $('#sec1', '#Accordion'), 
      accorGeography: $('#sec2', '#Accordion'), 
      accorAllIndia: $('#sec3', '#Accordion') 
     } 
    accordionOptions(accordionBox, accordionSec); 
}); 

매우 긴 HTML, 그래서 내가 여기에 배치 할 unabale.

HTML의 일부 미안 :

<ul class='subSec'> 
    <li> 
     <h4>1. Select a key index</h4> 
    </li> 
    <li> 
     <label> 
      <input type="radio" value="CCI" name="cci" checked>Consumer Confidence Index</label> 
    </li> 
    <li> 
     <label> 
      <input type="radio" value="HW" name="cci">Housewives Index</label> 
    </li> 
</ul> 
<ul class='subSec'> 
    <li> 
     <h4>2. Select your sub-indices (optional)</h4> 
    </li> 
    <li> 
     <label> 
      <input type="radio" value="CSI" name="subIndices">Consumer Spending Index</label> 
    </li> 
    <li> 
     <label> 
      <input type="radio" value="EI" name="subIndices">Employment Index</label> 
    </li> 
    <li> 
     <label> 
      <input type="radio" value="Ii" name="subIndices">Inflation Index</label> 
    </li> 
    <li> 
     <label> 
      <input type="radio" value="OI" name="subIndices">Onion Index</label> 
    </li> 
    <li> 
     <label> 
      <input type="radio" value="CI" name="subIndices">Corruption Index</label> 
    </li> 
</ul> 
+0

$ .each() 실행 방법 결정 – Chibuzo

+0

h3의 'click'내에 'click of class'를 추가했기 때문에 – musefan

+0

@ 3gwebtrain을 정상적으로 볼 수 있습니다. 그러면 'log'를 표시하기 위해 두 번 클릭해야합니다. – mgraph

답변

0

방법에 대한 return false; 클릭 이벤트 함수의 끝?

0

나는 그것이 이벤트 버블 링 문제라고 생각하지 않는다고 생각하고 있습니다.

var subSec = $(this).parent().children().find('.subSec');은 동일한 .subSec이 두 번 이상 발견되어 클릭 핸들러가 두 번 이상 연결되는 것으로 보입니다.

지금까지 내가 말할 수있는, 당신이 당신의 h3 요소에 클릭 기능을 $.each(accordionSec,function(i,values){...}); 래퍼를 제거하고 부착 할 수 있어야한다 :의 자세한 내용을 보지 않고

$('h3', context).each(function(){ 
    ... 
}); 

나는 context의 확실하지 않다 HTML하지만 당신은 그것을 해결할 수 있어야합니다. (시도 '#'+ accordian의 외부 래퍼의 ID).

편집 :

아, 네, 당신은 또한 다른 subSecs '클릭 기능을 통해 추가됩니다 모든 시간이 지남에 따라 외부 클릭 이벤트가 발생, 외부 클릭 핸들러 내부에서 $(subSec).click(function() {...));을 해방해야합니다.

+0

아니, 경우에 따라 2 개 이상의 '.subSec'인스턴스가 있지만 2 회만 호출됩니다. – 3gwebtrain

+0

답이 확실하지 않지만 편집을 참조하십시오. –

+0

'subSecs'의 수는 'accordionSecs'의 수로 결정되지 않습니다. –