2011-12-21 2 views
2

버그인지 또는이 작업을 수행 중이라고 생각하지 않습니다.ajax 호출 후 jquery, 동일한 ID를 사용하는 이벤트가 작동을 멈췄습니다

본문을 동적으로로드하는 사이드 바를 가진 페이지가 있습니다.

페이지 1의 경우 초기로드시 작동하는 # id1 요소에 대한 콜백이 있습니다.

사용자가 page2로 이동하면 주 콘텐츠는 page2의 콘텐츠로 대체되며 # 2의 콘텐츠도 # id1과 같은 목적으로 사용됩니다. 이벤트도 초기화됩니다.

문제는 페이지 2의 모든 것이 # id1과 연결된 이벤트를 제외하고는 작동한다는 것입니다.

페이지 1로 돌아 가면 # id1도 제대로 작동하지 않습니다.

콘솔을보고 난 후에 $ ("# id1")을 호출 할 때 가끔 초기로드 요소 (파괴되지 않은 것?)를주었습니다. 이것이 아마도 이유 일 것입니다.

아약스 부하는 단순히 사용

$ 갔지 (경로 기능 (데이터) {. $() 주 # 'HTML (데이터)});

여기에 무슨 일이 일어나고 있는지 아십니까?

이전 요소가 'jquery에서 제대로 소멸되지'않은 경우 여기에서 수행 할 것으로 가정합니다.

답변

6

정확히 무엇이 바인딩 중인지 확실하지 않지만 해결책은 (사용자의 jQuery 버전에 따라) live() 또는 on()을 사용하여 실행시 DOM에없는 요소에 바인딩되도록하는 것입니다.

jQuery를 1.7+ : on()

$(document).on('click', '.selector', function() { ... }); 

jQuery를 < 1.7 : live()

$('.selector').live('click', function() { ... }); 
+0

굉장! Thx 남자 !! 나는 항상 .bind' 또는'.on'을 사용하여 바인드하면 diffrence가 발생하지 않는다고 가르쳐 왔습니다. – noob

+0

'.bind'를 사용하면 selector에 지정된 요소에 직접 바인딩됩니다. 선택기와 일치하는 새 요소를 나중에 추가하면 해당 요소에 바인딩 된 이벤트가 없습니다. '.live' /'사용.on '을 사용하면 새로 만든 요소조차도 바운드 이벤트에 응답 할 수 있습니다.하지만 속도가 느려지므로 필요할 때만 사용해야합니다. – Interrobang

1

당신이 어떤 요소를 모르기 때문에

일단 ID 만 발생한다는 것을 기억하십시오 ID 님과 함께 DOM에 아직 살고있을 수도 있습니다 r Ajax 호출은 classname 대신 사용해야합니다.

jQuery의 .live()을 사용하여 동적으로로드 된 요소에 바인딩 할 수 있습니다.

+0

음, 문제는 Id가 한 번만 발생하지만, ajax를 사용하여 페이지를 다시로드하면 바인딩이 달라져서 페이지가로드 될 때마다 ID를 변경하는 것이 의미가 없다는 것입니다. T__T – Edison

1

동적 ID를 생성해야합니다. 오른쪽 막대 옵션을 클릭하면 ID가 생성되고 body 요소 "id"태그에 id가 배치됩니다. 어떤 ID가 어떤 페이지에 대해 생성되는지 알 수 있습니다. "onclick"이벤트에서 javascript 함수를 호출하고이 함수에 해당 id를 전달한 다음 본문 요소를 $("#id"+that generated_id).something; 으로 호출하십시오. 도움이 될 것 같습니다.

관련 문제