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/并显示其内容。

我很困惑为什么它可以在 Chrome 而不是 Safari 或 firefox 中工作。

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 回答