jQuery函数未提交Ajax请求答案

【问题标题】：jQuery function not submitting Ajax requestjQuery函数未提交Ajax请求
【发布时间】：2014-05-11 20:41:48
【问题描述】：

下面的函数/ajax 请求拒绝工作/'post'，我不知道为什么。
我假设 PHP 脚本从我的 Ajax 请求中接收到的任何数据变量都应引用为 $_POST['sday'] 和 $_POST['sdate']?
PS 成功函数应该如何处理来自我的 PHP 脚本的 JSON 编码响应？

我的代码：

<html>
<head>
    <title></title>
</head>
<body>
<h1>Welcome to Richmond nursing app, you have successfully logged in!</h1>
<hr>
<form id="idForm" name="idForm">
<input type="text" size="8" id="date" name="date"><br>
<input type="hidden" size="8" id="reversedate" name="reversedate"><br>
<input type="hidden" size="1" id="dow" name="dow"><br>
<input type="submit" id="submitbutton" name="submitbutton">
</form>
<div id="report" name="report">
</div>  
<br><br><br>
<br>
<br>
<p id="p1">x</p>
<br>
<a href="logout.php">log out</a>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">  </script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/ui.js"></script>
<script>
        $('#submitbutton').click(function(){
                  var fulldate=$('#date').datepicker('getDate');
                  var date=fulldate.getDate();
                  var day=fulldate.getDay();
                  var month=fulldate.getMonth()+1;
                  var year=fulldate.getFullYear();

                  if (month<10) 
                    {month="0"+month};
                  if(date<10)
                    {date="0"+date};

                 var selecteddate=year+"-"+month+"-"+date;
              
                 var url = "fetchsimple.php"; // the script where you handle the form input.
                  $.ajax({
                      type: "POST",
                      url: url,
                      data: {sdate: selecteddate, sday:day}, // serializes the form's elements.
                      success: function(data)
                      {
                          alert(data); // show response from the php script.
                      }
                    });
                });
</script>
</body>
</html>

【问题讨论】：

标签： javascript ajax post

【解决方案1】：

在 jquery 代码中处理提交事件，如下所示：

$('#submitbutton').click(function(e){
    e.preventDefault();
    .......
    .......

}

对于 JSON 响应添加

dataType: 'json'

到 ajax 请求，然后您可以使用带句点（。）符号的编码数据。例如：

alert(data.msg);

【讨论】：

谢谢，这成功了！ e.preventDefault() 行有什么作用？
它会阻止表单发布，这是它的默认行为。 preventDefault 阻止了这种情况的发生。就像它的名字一样:)
欢迎您。如果问题已解决，请将答案标记为已解决。
是的，我只是想澄清一下处理 json 编码的响应（请参阅下面的线程）...
我改进了 JSON 编码响应的答案。验证它:)

【解决方案2】：

处理表单的提交事件，而不是处理提交按钮的点击：

$('#idForm').submit(function() { ... ... 返回假； }

return false 将取消表单提交，让您的 AJAX 调用完成。

对于 JSON 响应，您要在 AJAX 调用中指定数据类型。

dataType: 'json'

【讨论】：

谢谢。然后在成功位中，我使用“每个”函数来遍历返回的 json 编码数据？