2 
    $(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");
}
4

8 に答える 8

10

これは私がしました：

送信する前に ajax するときに破棄し、div をクリアします。コメントを確認してください:

$(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-12T22:14:42.863 に答える
5

非同期だと思います。.load()つまり、.load()呼び出し中にスクリプトを実行し続けます。そのため、コールバック関数で mCustomScrollbar を呼び出す必要があります。そうしないと、コンテンツがまだ存在しません。だからこれを試してください

$('.content-text').load("packages/beauty-of-ceylon.php", function () {
    $("#content_1").mCustomScrollbar({
        scrollButtons:{
            enable:true
        }
    });
});
于 2012-11-20T18:17:08.487 に答える
2

しばらく経ちましたので、すでに解決策を見つけていると思います。そうでない場合、あなたのコードは一点まで正しいです。を実行した後.load、そのコールバック関数を使用して次のコマンドを開始します。

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

彼らのウェブサイトでは、コンテンツを更新するたびにこの関数を呼び出す必要があるため、mCustomScrollbar はコンテンツの高さ、スクロールバーなどを再計算する必要があります.

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

于 2013-02-22T03:30:42.720 に答える
1

次のような 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.スクリプト「myscript.vendor」の呼び出し

$.ajax({
    url: "/get/myscript.vendor",
    type: "post",
    dataType: "html",
    success: function (data) {
        $('#data').html(data);
    }
});
于 2014-08-14T20:47:54.687 に答える
0

ajax window.load を介してページをロードするときは呼び出されないため、mCustomScrollBar は初期化されません。ajax ドキュメントによるページのロードがトリガーされます。

以下のコードを試してください。

$(document).ready(function(){
    $("#content_1").mCustomScrollbar({
                scrollButtons:{
                    enable:true
                }
            });
});
于 2013-03-21T14:34:25.313 に答える