js 파일의 Jquery로드 콜백 함수

Question

상황 : 나는이 jy 파일에서 addyear 클릭 기능을 사용하여 데이터베이스에 새 연도를 추가하고 새 아코디언 수를 아코디언 div 컨테이너에 다시로드합니다. .

문제 : 콘텐츠를 다시로드하면이 콘텐츠에서 이전에 작동 한 js 기능이 더 이상 수행되지 않습니다.

내 시도 : 나는 부하 함수의 콜백 부분에 JS 기능을 넣는 시도 . 그러나 이것은 동일한 addyear 클릭 기능을 사용하여 다른 연도를 추가 할 때까지만 작동합니다.

Problem2 : JS 파일 내가 부하 콜백 함수에 더 많은 기능을 추가 할 때마다 더 크고 더 커지면

질문 : 단순히 함수를 참조하려면 어떻게 모든 것을 반복하지 않고 이미 내 스크립트에있는 객체입니까?

코드 : 참고로

$(document).ready(function(){ 

    //Here's where the function that I want to call is 
    $(".years").click(function(){...}); 

    //When a user clicks the addyear button, the following occurs: 
    $("#addyear").click(function(){ 

    //Load function will reload new content into accordion id div 
    $("#accordion").load("scripts/addyear.php,function(){ 

     //Occurs when you click the div with class years 
     $(".years").click(function(){...}); 

    }); 

    }); 

}); 

: 그 ... 내가 부하 콜백 쓰기를 방지하기 위해 노력하고있어 전체 클릭 기능이

Answer 1

DOM을 활용하다 대신에 이벤트 버블 링이 필요합니다. 일반적으로 함수 호출 내에서 더 많은 클릭 이벤트 핸들러를 더 바인딩하는 것은 현명하지 못합니다.

는

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

위의 라인은 유래 한 DOM합니다 (document 객체)의 상단에있는 모든 방법을 버블 링의 클릭 이벤트를 수신하는 브라우저에 지시)이 경우, 우리는 .on() 방법을 사용할 수 있습니다 'year'의 클래스를 가진 임의의 자손 요소로부터. 이렇게하면 런타임 중에 존재하는 기존 요소에서 발생한 클릭 이벤트와 동적으로 추가 된 요소 (런타임 중에 존재하지 않음)를 모두 캡처 할 수 있습니다. 당신이 뭔가를 매일 하하 배우고,

$(document).ready(function(){ 

    //Here's where the function that I want to call is 
    $(document).on('click', '.years', function() { 
    // Click event here 
    }); 

    $("#addyear").click(function(){ 

    //Load function will reload new content into accordion id div 
    $("#accordion").load("scripts/addyear.php,function(){ 
     // Callback function 
    }); 

    }); 

});