5

私は以下のようなコードを持っています:

$('a.load-more').on("click",function(){
    $.get($('a.load-more').attr('href'), function(data) {
   $(".next-page").remove();
   $('.block-grid').append(data);
   event.preventDefault();
});

html:

<li class="next-page">
<a href="http://example.com/ajax_all/" class="load-more">Load More →&lt;/a>
</li>

ご覧のとおり、.load-more 要素から ajax コンテンツの URL を取得し、それを $get メソッドに渡し、コンテンツを取得して現在のページに追加します。

奇妙なことに、これは Chrome では機能しますが、Firefox や Safari では機能せず、これらのブラウザーのインスペクターに js エラーはありません。

ajax を使用してコンテンツを取得する代わりに、URL http://example.com/ajax_all/に移動して、そのコンテンツを表示します。

Safari や Firefox ではなく Chrome で機能する理由がわかりません。

4

2 に答える 2

5

スクリプトが無効であるか、間違って貼り付けられています

$('a.load-more').on("click", function () {
    $.get($('a.load-more').attr('href'), function (data) {
        $(".next-page").remove();
        $('.block-grid').append(data);
        event.preventDefault();

});

それを修正した後、あなたが非同期event.preventDefault();である の中で起こっていることが示されます。get()

$('a.load-more').on("click", function () {
   $.get($('a.load-more').attr('href'), function (data) {
      $(".next-page").remove();
      $('.block-grid').append(data);
      event.preventDefault();
   });
});

preventDefaultコールバックの外側に配置すると、問題が解決するはずです。

$('a.load-more').on("click", function (e) {
    $.get($('a.load-more').attr('href'), function (data) {
        $(".next-page").remove();
        $('.block-grid').append(data);

    });
    e.preventDefault();
});
于 2012-12-21T15:11:45.450 に答える
3

あなたの問題はイベントという言葉です。それはクリックコールバックのパラメータにある必要があります。

それを試してください：

$('a.load-more').on("click", function(e){
    e.preventDefault();
    $.get($('a.load-more').attr('href'), function(data) {
        $(".next-page").remove();
        $('.block-grid').append(data);
    });
});
于 2012-12-21T15:13:14.243 に答える