jQuery中get和post方法传值测试及注意事项


Posted in Javascript onAugust 08, 2014

用 jQuery 的都知道,jQuery 的 get 和 post 方法有三个参数:地址,数据 和回调函数,但我们知道地址也可以跟随数据的(形如:get_data.php?v1=1&v2=2),而且第二个参数可以省略,即第二个参数可 以直接写回调函数,那么数据写在地址后面和写在 data 参数里有什么区别呢?
刚刚做了几个实验,看看下面的代码就清楚了:
以下内容需要回复才能看到

jquery_data.php

echo "post: ";
print_r($_POST);
echo "get: ";
print_r($_GET);
?>

jquery_test.html

实验1:

$(function() {
// post 方法,两处都有数据
$.post('jquery_data.php?v1=1', {v2: 2}, function(data) {
$('
').append(data).appendTo('body');
});
});

返回结果:

post: Array
(
[v2] => 2
)
get: Array
(
[v1] => 1
)

实验2:

$(function()
{
// post 方法,数据在地址后面, 第二个参数为回调函数
$.post('jquery_data.php?v1=1', function(data)
{
$('<pre/>').append(data).appendTo('body');
});
});

返回结果,数据在 get 中:

post: Array
(
)
get: Array
(
[v1] => 1
)

实验3:

$(function()
{
// get 方法,用 data 参数传值
$.get('jquery_data.php', {v2: 2}, function(data)
{
$('<pre/>').append(data).appendTo('body');
});
});

返回结果,数据在 get 中:

post: Array
(
)
get: Array
(
[v2] => 2
)

实验4:

$(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:

$(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 参数中。

总之方法是死的,人是活的,怎么用还要看实际情况。子曾经曰过:实践是检验真理的唯一标准。没事做做实验,掌握知识更牢固。

Javascript 相关文章推荐
JS模拟的QQ面板上的多级可展开的菜单
Oct 10 Javascript
jQuery简单实现banner图片切换
Jan 02 Javascript
javascript在当前窗口关闭前检测窗口是否关闭
Sep 29 Javascript
详谈jQuery操纵DOM元素属性 attr()和removeAtrr()方法
Jan 22 Javascript
jquery代码实现多选、不同分享功能
Jul 31 Javascript
javascript中SetInterval与setTimeout的定时器用法
Aug 24 Javascript
Bootstrap表单布局样式源代码
Jul 04 Javascript
Express的HTTP重定向到HTTPS的方法
Jun 06 Javascript
jQuery实现的简单拖拽功能示例【测试可用】
Aug 14 jQuery
koa源码中promise的解读
Nov 13 Javascript
JavaScript 接口原理与用法实例详解
May 12 Javascript
JS判断数组四种实现方法详解
Jun 29 Javascript
JSON.stringify转换JSON时日期时间不准确的解决方法
Aug 08 #Javascript
js事件监听机制(事件捕获)总结
Aug 08 #Javascript
使用jquery.qrcode生成彩色二维码实例
Aug 08 #Javascript
兼容最新firefox、chrome和IE的javascript图片预览实现代码
Aug 08 #Javascript
js调试工具console.log()方法查看js代码的执行情况
Aug 08 #Javascript
JS创建类和对象的两种不同方式
Aug 08 #Javascript
将HTML格式的String转化为HTMLElement的实现方法
Aug 07 #Javascript
You might like
PHP+DBM的同学录程序(1)
2006/10/09 PHP
php 网页游戏开发入门教程一(webgame+design)
2009/10/26 PHP
使用 PHPMAILER 发送邮件实例应用
2012/11/07 PHP
ThinkPHP实现批量删除数据的代码实例
2014/07/02 PHP
php字符比较函数similar_text、strnatcmp与strcasecmp用法分析
2014/11/18 PHP
PHP使用GD库输出汉字的方法【测试可用】
2016/11/10 PHP
php检查函数必传参数是否存在的实例详解
2017/08/28 PHP
用js实现的页面关键字密度查询代码
2007/12/27 Javascript
jQuery获得子元素个数的方法
2015/04/14 Javascript
深入理解JS addLoadEvent函数
2016/05/20 Javascript
谈谈第三方App接入微信登录 解读
2016/12/27 Javascript
基于vue2.0+vuex+localStorage开发的本地记事本示例
2017/02/28 Javascript
详解nodejs微信公众号开发——6.自定义菜单
2017/04/13 NodeJs
Vuex之理解Getters的用法实例
2017/04/19 Javascript
在knockoutjs 上自己实现的flux(实例讲解)
2017/12/18 Javascript
让python的Cookie.py模块支持冒号做key的方法
2010/12/28 Python
python处理文本文件实现生成指定格式文件的方法
2014/07/31 Python
Python导出数据到Excel可读取的CSV文件的方法
2015/05/12 Python
Python基础教程之浅拷贝和深拷贝实例详解
2017/07/15 Python
python使用socket创建tcp服务器和客户端
2018/04/12 Python
python爱心表白 每天都是浪漫七夕!
2018/08/18 Python
PyTorch在Windows环境搭建的方法步骤
2020/05/12 Python
Python3开发环境搭建详细教程
2020/06/18 Python
详解canvas多边形(蜘蛛图)的画法示例
2018/01/29 HTML / CSS
英国领先的游戏零售商:GAME
2019/09/24 全球购物
Nixon手表英国官网:美国尼克松手表品牌
2020/02/10 全球购物
学习雷锋活动总结
2014/04/29 职场文书
建筑安全生产目标责任书
2014/07/23 职场文书
八荣八耻的活动方案
2014/08/16 职场文书
小学生迎国庆演讲稿
2014/09/05 职场文书
小学四年级学生评语
2014/12/26 职场文书
聚会通知怎么写
2015/04/23 职场文书
行政撤诉申请书
2015/05/18 职场文书
检讨书格式
2019/04/25 职场文书
人生一定要学会的三样东西:放下、忘记、珍惜
2019/08/21 职场文书
Django实现聊天机器人
2021/05/31 Python