2009-11-29 4 views
1

나는 정상적인 동작일지도 모른다고 의심되는 특별한 문제가 있지만 확인해야 할 사람이 있습니다. 이 코드를 사용하여 <li> 요소의 수에 라이브 클릭 이벤트를 접선 해요 :jQuery die() 오직 하나만 지정하는 대신 모든 요소를 ​​죽이는 것

$('li', $list).live("click", rightItemSingleClickEvent); 
나는 $ 내의 모든 <li> 요소에 같은 라이브 클릭 이벤트를 연결하려면 여기를 담요 선택기를 사용하고 여기

주 목록, 이것은 순서가없는 목록입니다. $(document).ready()에서이 코드를 한 번 호출합니다. rightItemSingleClickEvent()는 실제로 메소드 맨 위에서 라이브 클릭 이벤트를 중지합니다. 이는 클릭과 관련된 애니메이션이 있고 애니메이션이 발생하는 동안 중복 클릭이 발생할 수 없기 때문에이를 죽이고 있기 때문입니다. 클릭을 죽일 코드는 다음과 같습니다 :

$notesArea.fadeIn(function() { 
    $listItem.live("click", rightItemSingleClickEvent); 
}); 

나는이 모든 코드가 잘 작동하는 것 같다 지적한다 : 애니메이션이 완료

$(this).die("click"); 

후, 나는이 클릭 이벤트를 다시 연결합니다. 클릭 할 목록 항목을 선택할 수 있으며 매번 강제 종료 및 다시 연결 (애니메이션 중에 중복되는 클릭을 방지) 할 수 있습니다. 그러나, 내 문제는 그 하나의 목록 항목 (<li>) 만 죽이고 있다고 생각할 때, 그 목록 항목을 모두 죽이는 것으로 보인다. 그래서 하나의 목록 항목을 클릭하면 기능이 계속 작동하면서 (여전히 클릭 할 수 있음) 다른 모든 항목을 더 이상 클릭 할 수 없습니다. 이것이 사실이라면 나는 모든 <li>의 표지를 담은 성명서를 통해 실시간 클릭 이벤트를 연결한다는 사실과 관련이 있는지 궁금합니다.

라이브 이벤트를 각 <li>에 개별적으로 연결하면 단일 선택기를 사용하여 라이브 이벤트를 모두 수행하는 대신 작동 할 수 있습니다. 하나의 <li>에 die()를 호출하면 형제도 모두 죽는 이유가 확실하지 않습니다.

어떤 통찰력도 인정 될 것입니다. 감사.

CLARIFICATION : rightItemSingleClickEvent에 대한 코드를 조금 더 게시해야합니다. 이 함수는 기본적으로 사용자가 목록 항목을 클릭 할 때 발생하는 것을 처리합니다. 나는 CSS 클래스를 추가하고 제거함으로써 클릭을 시뮬레이트하고 unclick하고있다. 클릭 한 번에 표시되고 숨길 때 숨겨진 또 다른 텍스트 상자가 있습니다. 실시간 클릭 이벤트에 다시 연결하기 전에 완료해야하는 애니메이션입니다. 또한 도우미 함수를 사용하여 click 이벤트를 연결하고 연결한다는 사실을 지적해야합니다. handleNotes()는 사용자가 클릭을 해제 할 때 텍스트 상자 텍스트를 저장하는 함수이며, 내가 생각하지 않는 몇 가지 다른 작업을 수행합니다 이 문제와 관련이있다. 그러나 더 혼란, 내 코드는 그럼에도 불구하고 아래에 게시 :

function rightItemSingleClickEvent(ev) { 

var $target = $(ev.target); // what was clicked on the item 
var $clickedItem = $('#' + $(this).attr('id')); 

killItemClickEvents($(this)); // kill live click event to prevent extra clicks during animation 

if ($target.is('a.ui-icon-circle-close')) { // if clicking remove icon, just remove the item 

    removeItem($clickedItem, getLeftList()); 
} 
else { // otherwise, handle click event 

    if ($clickedItem.hasClass("ui-state-default")) { // UNCLICK BUTTON LOGIC (if button is clicked) 

     handleNotes("hide", $clickedItem); // Hide notes box and store its contents in $(this)'s notes div 
     $clickedItem.removeClass("ui-state-default").addClass("ui-state-active"); // unclick button 
    } 
    else { // CLICK BUTTON LOGIC (if button is unclicked) 

     if ($clickedItem.siblings(".ui-state-default").attr('id') != undefined) { // if a button is already clicked 
      // got some stuff to do with button that was already clicked 
      var $prev_clickedButton = $clickedItem.siblings(".ui-state-default"); 

      handleNotes("store", $prev_clickedButton); 

      // now unclick all buttons -- only one clickable at a time 
      $prev_clickedButton.removeClass("ui-state-default").addClass("ui-state-active"); 

      handleNotes("toggle", $clickedItem); 
     } 
     else { 
      handleNotes("show", $clickedItem); // Show notes box and populate it with $(this)'s notes 
     } 

     // then click the button that was clicked (by changing its css class) 
     $clickedItem.removeClass("ui-state-active").removeClass("ui-state-hover").addClass("ui-state-default"); // click it 
    } 
} 
} 

UPDATE : 음이 HTML로 쓰여 나는 개별적으로 각 목록 항목에 클릭 이벤트를 연결하는 내 코드를 변경하고, 같은 동작은 여전히 ​​남아있다. 솔직히 무슨 일이 일어나고 있는지 모르겠습니다. 그러나 담요 라이브 연결 문이 없어도 하나의 목록 항목에서 클릭 이벤트를 죽이면 모든 항목에서 해당 항목이 삭제됩니다. 그리고 라이브 코드 이벤트를 죽이는 코드는 모두 하나뿐입니다. 위 코드는 제가 게시 한 이벤트입니다. 그래서 나는 완전히 손해를보고 있습니다.

업데이트 2 :이 문제를 극복하지 못했기 때문에 대신 코드를 수정하여 ": 애니메이션"상태를 확인하고 실시간 클릭 이벤트를 중단하고 다시 연결하는 아이디어를 포기했습니다.그러나 각 목록 항목에 개별적으로 라이브 클릭 이벤트를 할당 했더라도 한 목록 항목에서 kill()이 모든 항목을 죽이는 이유는 여전히 알고 싶습니다.

답변

0

첫 번째 문제는 live events을 할당하는 방법입니다.

Live events은 현재 선택기와 비교할 때만 작동합니다.

$('li', $list).live("click", rightItemSingleClickEvent); 

을하지만이 부모 요소 때문에 바운드

$('#'+$list.attr('id')+' li').live("click", rightItemSingleClickEvent); 

당신의 다이 호출이 모든 요소에 이벤트를 죽이는 이유는 다음과 같습니다

의미이 제대로 작동하지 않습니다 일단. 그것을 제거 할 때 모든 것을 제거합니다. 이벤트 위임 (.live())을 사용하는 주된 이유는 여러 이벤트가 아닌 하나의 이벤트 만 바인드하기 때문입니다.

+0

@petersendidit : 항상 내가 사용하는 선택기가 올바르지 않을 수도 있다고 생각 했었습니다. 나는 당신의 제안을 사용했지만 같은 행동이 남아 있습니다. 그래도 아이디어를 가져 주셔서 감사합니다. 나는 내 문제에 관계없이 당신의 방법이 더 나은 접근이라고 생각합니다. –

+0

더 많은 코드를 게시 할 수 있습니까? rightItemSingleClickEvent의 기능은 무엇입니까? – PetersenDidIt

+0

또한 이벤트 리스너를 종료하고 다시 연결하면 안됩니다. 클릭 할 때 현재 객체가 (': animated')인지 확인하고, 그렇지 않으면 그냥 false를 반환하면 나머지 작업을 수행합니다. – PetersenDidIt

관련 문제