jQuery的mCustomScrollbar不是Ajax內容

$(window).load(function(){ 
       $("#content_1").mCustomScrollbar({ 
        scrollButtons:{ 
         enable:true 
        } 
       }); 

// ajax code 
function beauty_of_ceylon() { 
    $('.content-text').html('<p style="position:absolute;"><img src="images/ajax-loader.gif" /></p>'); 
    $('.content-text').load("packages/beauty-of-ceylon.php"); 
}

來源

2012-11-05 AkilaH

什麼是「＃content_1」ID，在你的代碼？ –

這是一個滾動內容div – AkilaH

包括時它工作正常。但通過ajax加載後，它不起作用 – AkilaH

$('.content-text').load("packages/beauty-of-ceylon.php", function() { 
    $("#content_1").mCustomScrollbar({ 
     scrollButtons:{ 
      enable:true 
     } 
    }); 
    $content = '<button id="update" onclick="$('#content_1').mCustomScrollbar('update');" style="display:none"></button>'; 
    $('.content-text').append($content); 
    setTimeout("$('#update').click();",10); 
});

它爲我工作：d

來源

2013-04-25 15:54:42 user2320561

Thanx它的工作 – AkilaH

工作，我相信是異步的，這意味着它延續了通話過程中運行該腳本。所以你必須在回調函數中調用mCustomScrollbar，否則內容將不會在那裏。所以試試這個

$('.content-text').load("packages/beauty-of-ceylon.php", function() { 
    $("#content_1").mCustomScrollbar({ 
     scrollButtons:{ 
      enable:true 
     } 
    }); 
});

來源

2012-11-20 18:17:08 Byron

這是一段時間，所以我猜你已經找到了解決方案。如果沒有，你的代碼是正確的，一點。你做一個.load後，使用它的回調函數來啓動此命令：

$(selector).mCustomScrollbar("update");

在他們的網站，它說，每當你更新內容，你必須讓mCustomScrollbar重新計算內容的高度，滾動條等調用這個函數

http://manos.malihu.gr/jquery-custom-content-scroller/

來源

2013-02-22 03:30:42

當您加載通過AJAX頁面

window.load不會被調用，所以mCustomScrollBar不initialized.when頁面加載阿賈克斯文件準備將被觸發。

請嘗試下面的代碼。

$(document).ready(function(){ 
    $("#content_1").mCustomScrollbar({ 
       scrollButtons:{ 
        enable:true 
       } 
      }); 
});

來源

2013-03-21 14:34:25 Kishorevarma

簡單地嵌入腳本到JSON/AJAX調用的內容，如：

1.JSON/AJAX後端腳本（的MyScript .vendor，比如Ruby，PHP ...）

var myHTMLContent = '<script> 
    $(".popover-n-content").mCustomScrollbar({ 
     theme:"dark", 
     scrollInertia:100 
    }); 
    </script> 
    <div> 

    <-- Manipulate --> 
    <other_html_tags> 
    ... 
    </other_html_tags> 
    </div>';

2.Calling腳本「myscript.vendor」

$.ajax({ 
    url: "/get/myscript.vendor", 
    type: "post", 
    dataType: "html", 
    success: function (data) { 
     $('#data').html(data); 
    } 
});

來源

2014-08-14 20:47:54 dud3

$(document).ready(function(){ 
 
     (function($){ 
 
      $(every_selector).on("hover",function(){ 
 
       $(".your_content_selector").mCustomScrollbar({ 
 
        theme:"dark-2", 
 
        snapAmount:40, 
 
        scrollButtons:{enable:true}, 
 
        keyboard:{scrollAmount:40}, 
 
        mouseWheel:{deltaFactor:40}, 
 
        scrollInertia:400 
 
       }); 
 

 
      }); 
 
     })(jQuery); 
 
    });

來源

2016-07-11 21:57:43

請不要只是張貼代碼作爲答案。提供一些有關發生事件的信息。 – Dbz

請編輯更多信息。僅限代碼和「嘗試這個」的答案是不鼓勵的，因爲它們不包含可搜索的內容，也不解釋爲什麼有人應該「嘗試這個」。 – abarisone

嗨我這樣做:)

摧毀它，當阿賈克斯之前發送和清除div.Please支票評論

$(document).ready(function(){ 
    $(".YOUR-CONTENT-DIV").mCustomScrollbar({ 
     theme:"dark", 
    }); 


    $.ajax({ 
     url: "YOUR AJAX URL", 
     type: "post", 
     data: data, 
     beforeSend: function() { 
      $(".YOUR-CONTENT-DIV").mCustomScrollbar("destroy"); //Destroy 
      $('.YOUR-CONTENT-DIV').html('<div class="loading">Loading ...</div>'); //clear html because it will show normal scroll bar 
     }, 
     success: function(data) { 
      $('.YOUR-CONTENT-DIV').html(data); 
     }, 
     complete: function() { 
      $(".YOUR-CONTENT-DIV").mCustomScrollbar({ 
       theme:"dark", 
      });    
     } 
    }); 
});

來源

2016-08-12 22:14:42

謝謝兄弟！ –

非常感謝您的幫助..您拯救了我的一天.... –

jQuery的mCustomScrollbar不是Ajax內容

回答

相關問題