jQuery 中 get 和 post 方法传值需要注意的.
用 jQuery 的都知道，jQuery 的 get 和 post 方法有三个参数：地址，数据 和 回调函数，但我们知道地址也可以跟随数据的（形如：get_data.php?v1=1&v2=2），而且第二个参数可以省略，即第二个参数可以直接写回调函数，那么数据写在地址后面和写在 data 参数里有什么区别呢？
刚刚做了几个实验，看看下面的代码就清楚了:
jquery_data.php
jquery_test.html
实验1：
PLAIN TEXT >> JAVASCRIPT:
-
$(function()
-
{
-
// post 方法，两处都有数据
-
$.post('jquery_data.php?v1=1', {v2: 2}, function(data)
-
{
-
$('<pre/>').append(data).appendTo('body');
-
});
-
});
-
/*
-
返回结果：
-
post: Array
-
(
-
[v2] => 2
-
)
-
get: Array
-
(
-
[v1] => 1
-
)
-
*/
实验2：
PLAIN TEXT >> JAVASCRIPT:
-
$(function()
-
{
-
// post 方法，数据在地址后面， 第二个参数为回调函数
-
$.post('jquery_data.php?v1=1', function(data)
-
{
-
$('<pre/>').append(data).appendTo('body');
-
});
-
});
-
/*
-
返回结果，数据在 get 中：
-
post: Array
-
(
-
)
-
get: Array
-
(
-
[v1] => 1
-
)
-
*/
实验3：
PLAIN TEXT >> JAVASCRIPT:
-
$(function()
-
{
-
// get 方法，用 data 参数传值
-
$.get('jquery_data.php', {v2: 2}, function(data)
-
{
-
$('<pre/>').append(data).appendTo('body');
-
});
-
});
-
/*
-
返回结果，数据在 get 中：
-
post: Array
-
(
-
)
-
get: Array
-
(
-
[v2] => 2
-
)
-
*/
实验4：
PLAIN TEXT >> JAVASCRIPT:
-
$(function()
-
{
-
// get 方法，两处都有数据
-
$.get('jquery_data.php?v1=1', {v2: 2}, function(data)
-
{
-
$('<pre/>').append(data).appendTo('body');
-
});
-
});
-
/*
-
返回结果，两处数据被合并了，都在 get 中：
-
post: Array
-
(
-
)
-
get: Array
-
(
-
[v1] => 1
-
[v2] => 2
-
)
-
*/
实验5：
PLAIN TEXT >> JAVASCRIPT:
-
$(function()
-
{
-
// get 方法，两处都有数据，且变量名相同
-
$.get('jquery_data.php?v2=1', {v2: 2}, function(data)
-
{
-
$('<pre/>').append(data).appendTo('body');
-
});
-
});
-
/*
-
返回结果，数据在 get 中，且 data 参数中的数据覆盖了地址后面的数据：
-
post: Array
-
(
-
)
-
get: Array
-
(
-
[v2] => 2
-
)
-
*/
通过这几个简单的小例子不难看出，地址后面的数据永远是以 get 形式传递的，无论使用的是 get 方法还是 post 方法；而 data 参数中的数据是根据方法决定传递方式的。
因此，为了避免混淆，建议大家尽量不要把数据写在地址后面，而是统一放在 data 参数中。
当然，如果你想在用 post 方法时，同时利用 get 传值，那么就可以把要以 get 方式传递的数据写在地址后面，把要以 post 方式传递的数据写在 data 参数中。 
总之方法是死的，人是活的，怎么用还要看实际情况。子曾经曰过：实践是检验真理的唯一标准。没事做做实验，掌握知识更牢固。 
4 Comments »
Comment by Cssrain
2008/09/25 @ 11:49 #
总之方法是死的，人是活的，
哈哈，很好
Comment by simaopig
2009/07/02 @ 15:20 #
不错，看了演示后知道了，没事尽量把参数放在data里面，免得遇到一些奇怪的问题。
PS：谁能告诉我Joni’s First Name是啥？呵呵。
Pingback by jQuery get(),post(),ajaxStart(),ajaxStop() | 小小子，simaopig
2009/07/04 @ 21:46 #
[...] 扩展阅读 分类: JS&HTML 标签: ajax, jquery 作者：小小子 出处：小小子，simaopig(http://www.xiaoxiaozi.com) 本文版权归作者所有，欢迎转载，但未经作者同意必须保留版权声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。 是否对这些也感兴趣？jQuery getJSON()函数及getScript()函数jQuery load()函数帮你实现简单的AjaxAjax简介jquery append()和appendTo()深入学习jQueryDOM操作——基于命令改变页面 评论 (0) Trackbacks (0) 说点啥吧 Trackback [...]
Comment by bolo
2009/07/04 @ 22:13 #
嗯，学习了
RSS feed for comments on this post. TrackBack URI
Leave a comment