1

私はこれに似た問題を抱えています：JavaScriptがAJAXでロードされたDIV内で機能していませんが、私の問題はバインドするイベントがないことです。私はこれを持っています：

$('[title]').colorTip({color:'yellow'});

'title'属性を持つすべての要素をそのオブジェクトにバインドします。ページのリロードで正常に動作します。しかし、AJAX呼び出しの要素ではストーリーが異なり、javascriptが存在しないように表示されます。を使用してAJAXから他のイベントに要素をバインドすることは知ってlive()いますが、「イベント」を持たない要素をバインドするにはどうすればよいですか？

4

2 に答える 2

9

ajax呼び出しの後で、ツールチップを再バインドする必要があります。

$( document ).ajaxStop( function() {
    $('[title]').colorTip({color:'yellow'});
});

または、jbabeyが提案しているように、完全なコールバックを使用してツールチップを再バインドすることもできます（ここからの簡略化されたバージョン）。

$(
function(){
    // Get a reference to the content div (into which we will load content).
    var jContent = $( "#content" );             
    // Hook up link click events to load content.
    $( "a" ).click(
        function( objEvent ){
            var jLink = $( this );
            // Clear status list.
            $( "#ajax-status" ).empty();
            // Launch AJAX request.
            $.ajax(
                {
                    // The link we are accessing.
                    url: jLink.attr( "href" ),
                    // The type of request.
                    type: "get",
                    // The type of data that is getting returned.
                    dataType: "html",
                    complete: function(){
                        console.log("finalized ajax request");
                        //re-bind the tooltip
                        $('[title]').colorTip({color:'yellow'});
                    },
                    success: function( strData ){
                        console.log("ajax success");
                        console.log(strData);
                        // to something with the received data
                        jContent.html( strData );
                    }
                }                           
                );
            // Prevent default click.
            return( false );                    
        }
        );

}
);

あなたのコメントに基づいて、私は以下を含めました：また、ページの読み込み時にツールチップをバインドすることを確認する必要があります。

$( document ).ready( function() {
    $('[title]').colorTip({color:'yellow'});
});
于 2013-01-31T18:10:46.057 に答える
0

要素に変更イベントを作成できます。

$('title').live('change', function () {
whatever you want to do here
})

次に、属性を有効にするたびに変更をトリガーします。

$('title').trigger('change');
于 2013-01-31T18:12:41.253 に答える