문제

인덱스 페이지가 있습니다 index.php, 그리고 사용자가 프로젝트를 클릭 할 때 (이 질문을 위해 프로젝트가 HTML 페이지에 포함되어 있다고 가정 해 봅시다. aeffect.html aeffect.html div로 :

<div id="popupContainer"></div>

포함 된 내용이 포함되어 있습니다 index.php.

그러나 많은 프로젝트가 있습니다 index.php, 그리고이 각 프로젝트에는 닫기 버튼이 있습니다. 이 변수를 사용하여 비워 지려고했습니다 popupContainer 그것이 비어 있도록 재설정하기를 희망하고 aeffect.html 분리 할 것입니다.

//Close property
$("a.close").click(function(){
    $("#popupContainer").empty();
});

이것은 효과가없는 것 같습니다.이 작업을 수행하는 방법을 정확히 잘 모르겠습니다. 행동이 aeffect.html div를 제어 할 수 있습니다 index.php?

다음은 전체 jQuery입니다.

$(document).ready(function() {
//Find & Open
$(".projectThumb").click(function(){
        $("#popupContainer").load("/aeffect.html");
            });

//Close property
$("a.close").click(function(){
    $("#popupContainer").empty();
        });
});

index.php의 HTML은 다음과 같습니다

<div id="container">
    <div class="projectThumb">
    <img src="/img/aeffect_button_static.gif" width="146" height="199" class="button" name="aeffect" alt="" />
    <p class="title">A.EFFECT: Film Poster</p>
    </div>
</div>
<div id="popupContainer"></div>

및 aeffect.html의 HTML

<div class="projectPopup" id="aeffect">
    <a class="close">Close &times;</a>
    <img src="/img/aeffect_popup.jpg" width="500" height="729" alt="" />
    <p class="description">Description</p>
</div>
도움이 되었습니까?

해결책

그만큼 $('a.close').click() 핸들러가 모두가 추가되고 있습니다 a.close 집단 언제 index.php 잔뜩. 이것은 a.close 로드 된 컨텐츠에는 핸들러가 첨부되지 않습니다.

새 컨텐츠를로드 한 후 핸들러를 첨부하거나 사용하십시오. $('a.close').live('click', ...) 대신에.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top