当前位置 : 主页 > 网页制作 > JQuery >

JQuery Ajax函数使用相同的数据调用两次

来源:互联网 收集:自由互联 发布时间:2021-06-15
我正在构建一个非常简单的页面,这是一个待办事项列表.它接受来自用户的输入,用于新的待办事项表单,将待办事项POST到服务器,然后接收(几乎)相同的数据并将其添加到列表中.但是,每次
我正在构建一个非常简单的页面,这是一个待办事项列表.它接受来自用户的输入,用于新的待办事项表单,将待办事项POST到服务器,然后接收(几乎)相同的数据并将其添加到列表中.但是,每次将数据发送到服务器时,都会调用$.ajax函数两次.

我的js:

// todo.js
function onload() {
 $( "#datepicker" ).datepicker();
 $( "#todoform" ).submit(function(e){
  e.preventDefault();
  sendtodo();
  return false;
 });
}
function sendtodo() {
 $.ajax({
  url: '/blog/todo/newtodo/',
  type: "POST",
  success: function(data) {
   receivetodo(data);
  },
  data: ({
   body: $('#newbodytextarea').val(),
   title: $('#titleinput').val(),
   dateDue: $('#datepicker').val(),
   time: $('#timepicker').val(),
   category: $('#newcategory').val()}),
});
}
function receivetodo(data) {
 $('#todobody').append(data);
}

我的部分HTML:

<html>
<head>
<title>Todo list</title>
<link href="/django_media/css/todo/todo.style.css" rel="stylesheet" type="text/css">
<link href="/django_media/css/jquery-ui-1.8.5.custom.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="/django_media/js/jquery.js"></script>
<script type="text/javascript" src="/django_media/js/jquery-ui-custom.js"></script>
<script type="text/javascript" src="/django_media/js/todo/todo.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
  onload();
 });
</script>
</head>
<body>
[.................]
</body>
</html>

万一重要,我使用Django作为我的后端.返回的数据是< div>包含其他几个< div>标签和一些< h1>和< p>标签.将接收到的HTML附加到页面的代码部分工作正常,除了它将它附加两次(并且数据实际上在数据库中两次).

我尝试过使用$(“#todoform”).点击(函数(e){而不是$(“#todoform”).submit(function(e){但这并没有改变任何东西.我也确保onload ()只被调用一次.为什么sendtodo()执行两次?

如果您需要任何其他代码,我也可以发布它.

替换这个:

$( "#todoform" ).submit(function(e)

有了这个:

$( "#todoform" ).unbind('submit').submit(function(e)
网友评论