0

ajax呼び出し後にライトボックスに問題が発生しました

現時点ではこんな感じです

$(".trackz").click(function () {
    $(".contentmusic").remove();

    $.ajax({
        url: "data/loadContent.php?clickedcontent=" + $(this).attr("id"),
        success: function (html) {
            if (html) {
                $("#lightbox-panel").append(html);
                $("#lightbox, #lightbox-panel").fadeIn(300);
            }
        }
    });
});

しかし、このajax呼び出しでnewcontentをロードすると

 $(window).scroll(function () {
     if ($(window).scrollTop() == $(document).height() - $(window).height()) {

         var myStylesLocation = "css/demo.css";

         $.ajax({
             url: "data/loadMoreMusic.php?lastMusic=" + $(".trackz:last").attr("id"),
             success: function (html) {
                 if (html) {
                     $("#trackz").append(html);
                     $('.fdw-background').hover(
                         function () {
                             $(this).animate({
                                 opacity: '1'
                             });
                         },
                         function () {
                             $(this).animate({
                                 opacity: '0'
                             });
                         }
                     );
                 } else {
                     $('div#loadMoreMusic').replaceWith("<center>Finished loading Music</center>");
                 }
             }
         });
     }
 });

2回目のajax呼び出しによって生成された新しいコンテンツでは、ライトボックスが機能しなくなりました。誰かアイデア？

4

2 に答える 2

1

あなたは（おそらく）DOMがロードされたときにまだ存在していない要素でトリガーしようとしています。

これを使って：

//another notation because we want to trigger on a DOM manipulation
$('.someClass').on("click", "#someId", function(event){
     //do something
});

.someClassDOMがロードされたときにすでに存在しているクラスはどこにあり#someId、クリックしたいがまだ存在していなかったIDはどこにありますか。

于 2013-01-20T17:46:40.397 に答える
0

交換するとどうなりますか：

$(".trackz").click(function () {

と

$(".trackz").on('click', function () {

動的コンテンツをDOMに追加する場合、それらのイベント処理を利用することはできません。このon()メソッドを使用すると、DOMが変更されているかどうかに関係なく、要素のイベントハンドラーにアクセスできます。

また、の新機能を使用する必要がありますajax()。成功機能はdone()（同じjQueryオブジェクトにチェーンされたメソッド）に配置する必要があります。

于 2013-01-20T12:19:40.407 に答える