jquery .load를 사용하고 원본 문서에 javascript 기능을 유지하는 방법은 무엇입니까?

Question

jquery 슬라이더와 관련된 문제가 있습니다. 슬라이더 위치에 따라 div 내에서 3 개의 다른 PHP 코드를 호출하려고합니다. 문제는 jplayer, hover 및 다른 기능을 포함하는 페이지/문서의 다른 javascript는 첫 번째 인스턴스 (슬라이더의 "0"기본 설정)에서만 작동합니다. 문제는 다른 설정 코드가 슬라이더 변경을 통해 삽입 될 때 원본 자바 스크립트가있는 원본 문서에 남아 있지 않고 대신 새 문서 (및 파일 경로)가 실행된다는 것입니다.하지만 그럴 수는 없습니다. 그냥 PHP 코드를 삽입하고 원본 문서 및 자바 스크립트 기능을 유지하는 방법을 알아보십시오. 여기

슬라이더 스크립트입니다 : 여기

<script> 
$(function() { 
    $("#slider").slider({ 
     value:0, 
     min: 0, 
     max: 2, 
     step: 1, 
     slide: function(event, ui) { 
      $("#amount").val(ui.value); 
     }, 
     change: function(event, ui) { 
      var pyrScrURL = "pyrScr" + ui.value + ".1.8.php"; 
      $("#pyr").load(pyrScrURL); 
     } 
    }); 
    $("#amount").val("$" + $("#slider").slider("value")); 
}); 
</script> 

기본으로, 사업부의 HTML "0"PHP 파일 포함 : 여기

<div id="pyr"> 
    <?php include("pyrScr0.1.8.php");?> 
</div><!--end pyr div--> 

이 작동하지 않는 스크립트의 예입니다 html이 잘 실행 되더라도 슬라이더가 이동 한 후에도 : ​​

// hover 
$(document).ready(function() { 
$(".counter, .counterPM").hover(function(){ 
    var currentId = $(this).data("id"); 
    var currentRank = $(this).data("rank"); 
    var currentTitle = $(this).data("song_name"); 
    /*alert("the current title is " + currentTitle);*/ 
    $("#songName").html(currentTitle); 
}); 
}); 

감사합니다. 부통령 및 원조.

Answer 1

많은 것을 시도한 후에, 여기 나를 위해 일한 것이 있습니다. 슬라이더 변경 이벤트의 일부로 포함 된 PHP 파일 을에 삽입하려면 스크립트의 javascript 링크 태그를 추가해야했습니다. 난 그냥 참조하는 기본 문서 헤드의 스크립트 태그를 사용할 수 있다고 생각했다

<script type="text/javascript" src="scripts/hover.js"></script> 

<?php 
... 
?> 

모든 파일을 포함 -하지만 난하지 같아요.

이제는 js 스크립트 태그가 주 문서와 함께 포함 된 php 파일에 있습니다.

Answer 2

change 함수를 통해 DOM 요소를 삽입하는 것처럼 보입니다. jQuery on() 메서드가 트릭을 수행 할 수 있습니다.

호프 행운을 빕니다.

$('body').on('mouseenter', '.counter, .counterPM', function(){ 
    var currentId = $(this).data('id'), 
     currentRank = $(this).data('rank'), 
     currentTitle = $(this).data('title'); 

    $('#songName').html(currentTitle); 
}