javascript - 单击按钮时使用 Ajax 发送 POST 请求

Question

我有一个普通按钮，它会触发一个基本功能，将 HTML 中的元素值打印到控制台。

现在，我不想打印该元素的值，而是想通过 POST 请求将其发送到我的 Django View 。

这是函数:

$(document).on('click','.btnClick', function() {
   var myvalue = $(this).data("myid");
   console.log(myvalue);
});

在这里，我想使用 Ajax 通过 post 请求发送 myvalue，而不是打印该值。

我知道如何执行 POST 请求，唯一的区别是，这次我没有使用表单，而是使用单个按钮来触发请求，而且我不太习惯。

这是我如何使用表单来做到这一点:

$(document).ready(function () {
  $("#myform").submit(function (event) {
    $.ajax({
      type: "POST",
      url: "/myurl/",
      data: {
        'myvalue': $('id').val()
      },
    });
    return false;
  });
});

所以，基本上我只需要知道如何将这段代码集成到第一个函数中，以便 Ajax 调用不是由表单(如第二个代码中那样)触发，而是由按钮触发。

Answer 1

只需将 jquery ajax 函数放入点击事件函数中即可。

$(document).on('click','.btnClick', function() {
   var myvalue = $(this).data("myid");
   $.ajax({
      type: "POST",
      url: "/myurl/",
      data: {
        'myvalue': myvalue
      },
    });
});

希望这会有所帮助。