2011-04-29 2 views
1

빈번하게 바뀌는 div가 아약스에 의해 innerHTML입니다. 페이지가로드되면 jQuery function()이 작동하지만 innerHTML이 ajax만큼 변경되면 일부 기능이 작동하지 않습니다. firebug를 사용하여 코드를 점검하고 짧게 설명하려고합니다. **jQuery fn()이로드/작동하지 않습니까?

DOM은 페이지가 처음으로로드 될 때만 js 파일을로드하고 아약스가 innerHTML을 수정하면 함수가 호출되지 않습니다. 어떻게됩니까? 너에게 어떤 해결책이 될 수 있니? HTML 페이지

<body> 
    <div class="_div_change"> dynamically class add by jQuery function() 

     here contenet is added by ajax functionality 
    </div> 

    <script type="text/javascript"> 
      $(function(){ 
      $('._div_change').addClass('.div_class'); 
       }); 
    </script> 
    </body> 

Loading first time & class is added by fn() |only div innerHTML modified by ajax *** 
              | 
    <div class="_div_change div_class">  | <div class="_div_change"> 
     innerHTML elements added successfully| innerHTML elements altered successfully 
    </div>         | </div>  

답변

1

스크립트가 불완전하지만 가정하면 그것은 다음과 같습니다 것을 :

$(function(){ 
     $('._div_change').addClass('.div_class'); 
}); 

이 ... 당신이하고있는 다음 무엇을 jQuery를 그 실행이 말하고있다 함수 DOM을 처음로드 할 때 (기능이있는 $() 호출은 jQuery.ready의 바로 가기 임). ajax를 통해 div의 내용을 업데이트 할 때 해당 함수를 다시 실행하려면 ayax 호출의 success 처리기에서 수행해야합니다.

ajax 호출이 완료 될 때마다 호출 할 함수 인 jQuery에 jQuery.ajaxSuccess을 사용하면 유용 할 수 있습니다.

+0

감사 TJ 설명하는 : 당신이 범위로 해당 요소와 기능을 다시 실행할 수 있습니다, 그리고 그것은 단지 새로 추가 된 내용에 변경 사항을 적용합니다, id="asdf" 하나를 말할 수 논리. 스크립트를 편집했습니다. – Bibhaw

1

예, 코드는 페이지가로드 될 때 한 번만 실행됩니다.

$(function(){...});$(document).ready(function(){...});의 준비 이벤트를 연결하는 간단한 형식입니다.

DOM을 변경하고 jQuery 코드를 새 요소에 적용하려면 상위 요소를 범위로 사용하여 코드를 다시 실행해야합니다.

function updateElements(scope) { 
    $('._div_change', scope).addClass('.div_class'); 
} 

지금 당신이 범위로 문서를 준비 이벤트에서 기능을 실행할 수 있습니다 : 코드와 기능과 범위 매개 변수를 만들기

$(function(){ 
    updateElements(document); 
}); 

당신은 요소에 새로운 콘텐츠를로드 한 경우

updateElements($('#asdf')); 
+0

아, 알겠습니다. 분명히 해주셔서 고맙습니다. 고맙다! – Bibhaw

+0

당신은 바위 사람 :). 지금 일하고있어. 나는 지난 이틀 이후 붙어 있었다 : P. 고마워. – Bibhaw

관련 문제