jquery 未使用preventDefault取消我的表单

vdgimpew  于 2023-03-01  发布在  jQuery
关注(0)|答案(1)|浏览(166)

我有一个图片库,我正在尝试分页。我已经在我的控制器中完成了这个函数(我使用C#),当我点击一个按钮进入下一页时,这个函数会被调用。问题是,如果我这样做,我会刷新所有的页面,现在我使用Jquery只刷新图片库。
我的问题是,当我点击提交按钮时,就像e.preventDefault();被忽略了一样。
这是我的提交表格:

<form action="~/Home/pagination" method="post" id="ajax_submit_next">
         <button id="btnNext" value="@item.getNumeroEntrega()" type="submit">
               Siguiente
          </button>
</form>

这是我的jquery:

$("#ajax_submit_next").submit(function (e) {
  e.preventDefault();
     console.log("prevent Default");

    var data = {
        'paginacion': 'siguiente',
        'entrega': $("#btnNext").val()
    }
    console.log(data)

    $.ajax({

        url: '/Home/pagination/',
        type: 'POST',
        data: data,
        success: function (result) {
            console.log(result);
        },
        error: function (err) {
            console.log(err);
        }
    });
})

Js file正在工作,因为我有更多的功能工作得很好,
为什么会这样呢?

eeq64g8w

eeq64g8w1#

看这里,它正在工作,可能是其他因素影响了代码的执行。

    • 工作代码片段**
$("#ajax_submit_next").submit(function (e) {
  e.preventDefault();
  console.log("prevent Default");

  var data = {
    paginacion: "siguiente",
    entrega: $("#btnNext").val(),
  };
  console.log(data);

  $.ajax({
    url: "/Home/pagination/",
    type: "POST",
    data: data,
    success: function (result) {
      console.log(result);
    },
    error: function (err) {
      console.log(err);
    },
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="~/Home/pagination" method="post" id="ajax_submit_next">
    <button id="btnNext" value="@item.getNumeroEntrega()" type="submit">
        Siguiente
    </button>
</form>
    • 不工作代码片段**

一个二个一个一个
在这里你会看到任何JS问题都会导致你其他代码。2所以我建议你调试更多。

相关问题