Ajax post方法不起作用答案

【问题标题】：Ajax post method not workingAjax post方法不起作用
【发布时间】：2012-05-31 09:05:10
【问题描述】：

我目前正在创建一个网站，但在使用 AJAX 发布我的数据时遇到了问题。我有一个按钮，单击时会处理以下代码...

var name = document.getElementById('name').innerHTML;
var text = document.getElementById('text').innerHTML; 

$.ajax({  
    type: "POST",  
    url: "php/post.php",  
    data: { postName: name, postText: text},  
    success: function() {  
        $('#paragraph').html("worked");    
    }  
});

这肯定会打开 post.php 页面，但它没有传递所需的数据。我做错了吗？

提前致谢

【问题讨论】：

那些ID name 和text 属于什么？一个文本框？如果是，那么您应该使用.value 或$('#name').val()

标签： javascript jquery html ajax post

【解决方案1】：

变量名称和文本包含什么？而不是做

var name = document.getElementById('name').innerHTML;
var text = document.getElementById('text').innerHTML;

你可以这样做：

var name = $("#name").val(); 
var text = $("#text").val();

您可能还需要传递数据类型对象：

$.ajax({  
type: "POST",  
url: "php/post.php",  
data: { postName: name, postText: text}, 
dataType: "json",
success: function() {  
    $('#paragraph').html("worked");    
}  
});

【讨论】：

dataType 是接收而不是发送所必需的，OP 的问题是他无法发送数据
数据类型是接收而不是发送，
ok 将其更改为 .val() 似乎可以修复它，现在数据正在正确处理。非常感谢您的帮助:)

【解决方案2】：

我猜你并没有阻止默认的按钮点击行为。可能您应该使用按钮单击上的preventDefault 函数来停止处理默认表单发布。还要确保您的表单元素中包含 ID 为 name 和 text 的内容

$(function(){  

    $("#yourButtonId").click(function(e){
    {
      e.preventDefault();
      var name = $('#name').html();
      var text = $('#text').html();

      if(name!="") 
      {    
         $.ajax({  
           type: "POST",  
           url: "php/post.php",  
           data: { postName: name, postText: text},  
           success: function() {  
              $('#paragraph').html("worked");    
           }   
         });  
       }
       else
       {
         alert("Why should i do ajax when content is empty!");
       }
    }); 

});

【讨论】：

【解决方案3】：

var name = $('#name').text();
var text = $('#text').text(); 

$.ajax({  
  type: "POST",  
  url: "php/post.php",  
  data: { postName: name, postText: text}, 
  dataType: 'json',
  success: function() {  
    $('#paragraph').html("worked");    
  }  
});

【讨论】：

.html() 将等同于 innerHTML -> .text() 将剥离他的所有标记。

【解决方案4】：

var name = document.getElementById('name').value,
    text = document.getElementById('text').value, 
    postData = JSON.stringify({ postName: name, postText: text});
$.ajax({  
    type: "POST",  
    url: "php/post.php",  
    data: postData,
    success: function() {  
        $('#paragraph').html("worked");    
    }  
});

您需要包含对json2.js 的引用才能在旧版浏览器中使用。你可以在这里下载：https://github.com/douglascrockford/JSON-js

【讨论】：