jQuery GET によってロードされたページで Javascript を呼び出す

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

  •  19-09-2019
  •  | 
  •  

質問

通常のページがヘッド内で JavaScript を呼び出していると想像してください。問題は、リンクをクリックするまで一部のコンテンツが読み込まれないことです。その後、このリンクがコンテンツをロードすると、機能しなくなります。これは、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 にも当てはまります。

上記の関数から受け取ったときに JavaScript と HTML を呼び出さずにこれを回避する方法があるかどうか疑問に思っていました

役に立ちましたか？

解決

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() イベント委任を使用し、 すべてのイベントがサポートされているわけではありません).

アンディはこれを試してみてください。 HTMLは、実際にページに追加される前に、各AJAX要求が完了した後、それは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のはそれが含まれていた場合（JavScriptとして解釈されません）いくつかのテキストに、この要素のinnerHTMLのを設定しているbeccause実行されません。だから、セキュリティが横に効果あります。

これを解決する方法は？

あなたの応答内のすべてのSCRIPTタグを見つけて、休閑としてそれらを実行しようとします：

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