javascript - ajax - Ajax 代码未执行

Question

我正在学习 Ajax，遇到了一个小问题。

我正在尝试使用 ajax 向 django 后端提交 POST 请求。 即使警报也不会显示在屏幕上。 正如我在测试 django 服务器 shell 中看到的，它甚至不提交 POST 请求。

代码:

<script type="text/javascript">
    $('#btnLike').on('click', function(event) {
     alert('ok');

      $.ajax({
       type: 'POST',
        url: 'http://127.0.0.1:8000/backend/website/like', /* for testig */
        data: {
         csrfmiddlewaretoken: {% csrf_token %},
         post_id = $('#post_id').val(),
         },
       });
      });
</script>

HTML 表单:

<form onsubmit="return false">
 {% csrf_token %}
 <input type="text" name="post_id" value= {{post.pk}} hidden="hidden">
 <button type="submit" name="btnLike" class="btn btn-info">Like</button>
</form>

我知道我做了一些非常错误的事情，但我不知道是什么。

Answer 1

您的选择器$('#btnLike')不正确，它正在寻找带有id="btnLike"的按钮。

试试这个:

<button type="submit" id="btnLike" class="btn btn-info">Like</button>

请确保在 HTML 中加载 jQuery 库并将所有 jQuery 代码包装到

$(document).ready(function(){ 
    //your code goes here
 });