jQuery get에 의해로드 된 후 페이지에서 JavaScript 호출

StackOverflow https://stackoverflow.com/questions/1704559

  •  19-09-2019
  •  | 
  •  

문제

Javscript를 헤드로 호출하는 일반 페이지를 상상해보십시오. 문제는 링크를 클릭 할 때까지 컨텐츠 중 일부가로드되지 않는다는 것입니다. 이어서이 링크가 컨텐츠를로드하면 작동하지 않습니다. JavaScript가 이미 실행되었으므로 나중에 호출 된 요소에 첨부되지 않기 때문입니다. 표준 HTML 만 호출됩니다.

예를 들어 이것은 내 외부 HTML을 호출하는 코드입니다.

$.get('content.inc.php', {id:id}, function(data){
        $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
           $(this).html(data).slideDown('slow');
        });
    });

예를 들어 HTML을 호출하고 H1 태그가 이미 페이지에있는 경우 Cufon이 작동합니다. 그러나 위의 방법을 통해 컨텐츠를로드하고 있기 때문에 선택한 글꼴로 H1 태그가 변경되지 않습니다.이 예제 일뿐입니다. JavaScript에도 동일하게 적용됩니다.

위의 함수에서 수신 된 경우 html을 JavaScript를 호출하지 않고 이것에 대한 방법이 있는지 여부를 원했습니다.

도움이 되었습니까?

해결책

하다 Cufon.refresh() 당신이 원하는 것을합니까?

당신이 말했듯이 Cufon ~였다 그냥 예입니다, 나는 또한 더 일반적인 것을 제안합니다.

$.get(url, options, function(html, status) {
    var dom = $(html);
    // call your function to manipulate the new elements and attach
    // event handlers etc:
    enhance(dom);

    // insert DOM into page and animate:
    dom.hide();
    $target_element.append(dom); // <-- append/prepend/replace whatever.
    dom.show(); // <-- replace with custom animation
});

다른 팁

동적으로 생성 된 페이지의 요소에 이벤트를 첨부하려면 "라이브"키워드를 살펴보십시오. 

$('H1').live("click", function() { alert('it works!'); });

이것이 당신이 찾고 있던 것이기를 바랍니다.

이벤트 핸들러를 통해 얻는 데이터에 첨부 할 수 있습니다. get() 콜백 함수 내부. 예를 들어

$.get('content.inc.php', {id:id}, function(data){
    $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){        
        $(this).html(data).find('a').click(function(e) {
            // specify an event handler for <a> elements in returned data
        }).end().slideDown('slow');
    });
});

live() 어떤 이벤트에 묶고 싶은지에 따라 (이후 live() 이벤트 대표단을 사용하고 모든 이벤트가 지원되는 것은 아닙니다).

앤디 이것을 시도하십시오. 각 AJAX 요청이 완료되고 HTML이 실제로 페이지에 추가되기 전에 CUFON 코드를 호출합니다.

$.get('content.inc.php', {id:id}, function(data){
    $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
        $(this).html(data);
        Cufon.replace('h1');
        $(this).slideDown('slow');
    });
});

JavaScript는 보안상의 이유로 인해 실행되지 않거나 jQuery 가이 요소의 내부 html을 일부 텍스트 (javscript로 해석되지 않음)로 설정하는 경우에 실행되지 않습니다. 따라서 보안은 옆에 있습니다.

그것을 해결하는 방법?

응답에서 모든 스크립트 태그를 찾아서 실행하십시오.

var scripts = myelement.getElementsByTagName("SCRIPT");
var i = 0;

for (i = 0; i < scripts.length; i++)
   eval(scripts[i].innerHTML);
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top