Ajax post方法不起作用
Posted
技术标签:
【中文标题】Ajax post方法不起作用【英文标题】:Ajax post method not working 【发布时间】: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 页面,但它没有传递所需的数据。我做错了吗?
提前致谢
【问题讨论】:
那些IDname
和text
属于什么?一个文本框?如果是,那么您应该使用.value
或$('#name').val()
【参考方案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
【讨论】:
以上是关于Ajax post方法不起作用的主要内容,如果未能解决你的问题,请参考以下文章
Spring Rest API 的 AJAX POST 方法不起作用
Angular 的 $http.post 不起作用,它的 $http... 也不起作用,但 jQuerys ajax 起作用。为啥?