Laravel5 使用 Jquery Ajax 进行分页答案

【问题标题】：Laravel5 pagination with Jquery AjaxLaravel5 使用 Jquery Ajax 进行分页
【发布时间】：2016-01-28 05:25:48
【问题描述】：

我正在使用 Laravel5 分页。我添加了一些 ajax 代码，因为当我单击下一步按钮时，我不需要刷新页面。

我的问题是当我单击下一步按钮时，我的页面正在刷新。请帮我找到这个问题。我的代码和屏幕截图如下。

在 firefox firebug 控制台显示一些错误“TypeError: Argument 1 of Window.getDefaultComputedStyle is not an object.”

js #abilitytest：在引导模型中显示数据的点击功能

$( "#abilitytest" ).click(function() {
    $.post("/abilitytest", function(response){
        $( "#abilityQuestions" ).html(response);
    });
});


$('.pagination a').on('click', function (event) {
    event.preventDefault();
    var page = $(this).attr('href');
    console.log(page);
    alert('hai');
});

控制器

$abilitytests = Abilitytest::simplePaginate(1);
return view('test.abilitytestmodal',['abilitytests' => $abilitytests]);

【问题讨论】：

.pagination a 是 #abilityQuestions 中的一个元素吗？ #abilitytest 是 <a> 标签吗？你看到你的console.log 或alert 了吗？提到的 TypeError 似乎与您在此处发布的代码无关。

标签： javascript jquery twitter-bootstrap laravel laravel-5

【解决方案1】：

在$('.pagination a') 上绑定事件监听器可能有问题？

试试

$(document).on('click', '.pagination a', function(event){

代替

$('.pagination a').on('click', function (event) {

【讨论】：

@samsam 查看已编辑的帖子。我觉得你可能试图错误地实现它。

【解决方案2】：

你可以像这样在文档上使用 jQuery

$(document).ready(function (){ $('.pagination a').on('click', function (event) {

【讨论】：

是的，因为我做了一个例子
您的回答似乎与 OP 的问题无关。
是的，你只需要完成它并不难，但显然这里人们需要所有代码，他们希望你编写所有代码，他们说谢谢它在这种情况下没有编码它只是采取并复制
不管 Yummy 说什么，我看不出你的 $(document).ready() 会如何解决这个问题。据我了解，导致问题的不是 Ajax 调用本身。
好吧，也许他没有，但这只是另一种没有问题的方法

【解决方案3】：

目前我正在使用 laravel 分页内置函数 simplePaginate()。

Abilitytest::simplePaginate(1) ul 分页类将是 class="pager".<ul class="pager">。

如果我们使用 laravel 内置函数paginate()，那么分页的 ul 类将为 class="pagination"..

所以问题是我在 JS 文件“<ul class="pagination">”中使用了错误的类名。

所以我的代码是

$('.pager a').on('click', function (event) {
    event.preventDefault();
    var page = $(this).attr('href');
    console.log(page);
    alert('hai');
});

谢谢

【讨论】：