html $.post,jQuery $.post()方法的用法

在 jQuery 中，除了 $.get() 方法，我们还可以使用 $.post() 方法来通过 Ajax 向服务器请求获取数据。

$.get() 方法和 $.post() 方法在使用方式上差不多，不过两者还是有一定的区别：

get 方式不适合较大的数据量，并且它的请求信息会保存在浏览器缓存中，因此安全性不好；

post 方式不存在上述的不足。

语法：

$.post(url,data,fn,type)

$.post() 方法有 4 个参数，如表 1 所示。

表 1：$.post() 方法的 4 个参数

参数

说明

url

必选参数，表示被加载的页面地址

data

可选参数，表示发送到服务器的数据

fn

可选参数，表示请求成功后的回调函数

type

可选参数，表示服务器返回的内容格式

接下来举一个例子，首先我们需要准备两个文件：一个是扩展名为 PHP 的文件，另一个是扩展名为 html 的文件。

扩展名为 PHP 的文件代码如下：

header("Content-Type:text/html; charset=utf-8");

echo "

{$_REQUEST['username']}:

{$_REQUEST['content']}

";

?>

扩展名为 html 的文件代码如下：

.item h4{margin:5px;background-color:#F1F1F1;}

.item p{margin:0;text-indent:2em;}

$(function(){

$("#send").click(function(){

$.post("get.PHP",{

username : $("#name").val(),content : $("#content").val()

},function (data,textStatus){

$("#comment").html(data); // 把返回的数据添加到页面上

}

);

})

})

小伙伴们，快快到碗里来！

昵称:

内容:

已有评论：

预览效果如图 1 所示。

图 1：默认效果

我们在表单中输入内容，点击【提交】按钮后，就会将表单内容通过 Ajax 传给后端服务器，结果如图 2 所示。

图 2：提交内容后的效果

上面这个例子与 $.get() 方法的例子是一样的，只不过我们这里是使用 $.post() 方法来实现的。

总结

如果觉得编程之家网站内容还不错，欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。

小编个人微信号 jb51ccc

喜欢与人分享编程技术与工作经验，欢迎加入编程之家官方交流群！