1

Web サイトで作業しているときに、クリックした画像に応じてコンテンツを更新したいコンテンツ領域部門がありました。これで、コンテンツ領域で使用するカスタマイズされたスクロールバーができました。最初に、onclick スクリプト関数の次のスニペットを作成しました。

function xyz(){
    $("#content-area").load("abc.php");
    $("#content-area").mCustomScrollbar({scrollButtons:{enable:true}});
}

しかし、スクリプトの 2 行目は応答しませんでした。つまり、スクロールバーが表示されませんでした。代わりに、このコード スニペットを使用すると、機能しました。

$.post("abc.php", function(data){
   $("#content-area").html(data);
   $("#content-area").mCustomScrollbar({scrollButtons:{enable:true}});
});

$.post() の機能と、2 番目のスニペットが機能している間に最初のスニペットが機能しなかったのはなぜですか?

4

3 に答える 3

3

AJAX リクエストが送信mCustomScrollbarされた直後に実行される最初のケースでは、覚えておいてください。最初の AJAX は forです。しかし、サーバーからの応答がまだここにないため、明らかにまだ何もする必要はありません。Aasynchronous

2 番目のスニペットでは、AJAX 要求の応答が受信mCustomScrollbarされた直後に(この行は成功ハンドラーの一部であるため)ウィジェットの作成が行われ、必要な構造 (with ) 呼び出しが満たされます。そのため、正しく動作するようになりました。$.post#content-area.html()

here で$.load説明されているように、リクエストが完了したときに実行されるカスタムコールバック関数をメソッドに提供できるという事実を利用できます。例えば：

$("#content-area").load("abc.php", function() {
     $(this).mCustomScrollbar({scrollButtons:{enable:true}});
});

$(this)使用法に注意してください。thisコールバック関数内の各 DOM 要素に順番に設定されているため、DOM をcontent-areaもう一度探し回る必要はありません。その要素を jQuery オブジェクトにラップするだけで十分です。

于 2012-12-25T18:14:40.807 に答える
1

リクエストが完了したときに実行されるコールバック関数を使用する必要があります。

$("#content-area").load("abc.php", function(){
     $(this).mCustomScrollbar({scrollButtons:{enable:true}});
});
于 2012-12-25T18:16:10.597 に答える
0

最初の例では、.load()関数の完了前に 2 番目のステートメントが実行されていたと思います。2 番目では、成功関数を正しく使用しています。これは、POST 要求の完了後にのみ実行されます。

于 2012-12-25T18:13:52.613 に答える