JS中传递参数的几种不同方法比较


Posted in Javascript onJanuary 20, 2017

在进行网页开发时,与前台与后台数据进行交互是一个无法避免的问题,不同的业务需求有着不同的传递方式,下面是我在开发过程中用到过的几种传递方式,写出来与大家分享一下,由于经验不足,出现错误的地方欢迎大家指正。

1、通过window.location.href或者document.location.href进行传递,比如window.location.href="http://www.ewcar.net?name=sun&age=21";在这个例子中所携带的参数即为name和age,分别是sun和21,当然还可以加上锚点#,可以指定到页面的某一个位置。

2、通过Ajax进行数据的传递,格式如下:

$.ajax{
  type: "post",
  url: "test/index",
  dataType: json,
  data: $("#orderForm").serialize() ,
  success: function(d){
   alert(d.msg);
  }
  error:function(d){
   alert(d.error);
  }
 }

其中data即代表着要传递的数据

3、通过Ajax的post方法进行传递,格式如下:

$.post({
  "url", 
  $("#orderForm").serialize(),
  function(d){
   alert(d.msg);
  }
 });

理论上来说这也是属于Ajax方法,不过这个方法相对来说简单一点。

4、form表格中的action方法也可以传递数据,但是action方法相对来说传递的东西更为全面,可以跳到连接,也可以跳到文本、图片、视频等多媒体内容,action里面的链接和window.location携带参数的方法是一样的。

以上就是我用到过的传参方法,如果以后遇到新的方法再来更新。

希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
js判断一个元素是否为另一个元素的子元素的代码
Mar 21 Javascript
基于jQuery的360图片展示实现代码
Jun 14 Javascript
javascript利用控件对windows的操作实现原理与应用
Dec 23 Javascript
Javascript保存网页为图片借助于html2canvas库实现
Sep 05 Javascript
JS实现仿FLASH效果的竖排导航代码
Sep 15 Javascript
jQuery图片轮播滚动切换代码分享
Apr 20 Javascript
每天一篇javascript学习小结(基础知识)
Nov 10 Javascript
jQuery中ajax错误调试分析
Dec 01 Javascript
bootstrap下拉菜单使用方法解析
Jan 13 Javascript
Vue2.X和Vue3.0数据响应原理变化的区别
Nov 07 Javascript
理解JavaScript中的Proxy 与 Reflection API
Sep 21 Javascript
Python机器学习之决策树和随机森林
Jul 15 Javascript
JS出现失效的情况总结
Jan 20 #Javascript
JSON 数据详解及实例代码分析
Jan 20 #Javascript
Angular ui.bootstrap.pagination分页
Jan 20 #Javascript
bootstrap中的 form表单属性role="form"的作用详解
Jan 20 #Javascript
javascript容错处理代码(屏蔽js错误)
Jan 20 #Javascript
关于AngularJs数据的本地存储详解
Jan 20 #Javascript
html5 canvas 详细使用教程
Jan 20 #Javascript
You might like
php中的静态变量的基本用法
2014/03/20 PHP
如何用PHP做到页面注册审核
2017/03/02 PHP
PHP使用ActiveMQ实例
2018/02/05 PHP
获取URL地址中的文件名和参数的javascript代码
2009/09/02 Javascript
JS 图片缩放效果代码
2010/06/09 Javascript
JS简单实现文件上传实例代码(无需插件)
2013/11/15 Javascript
基于NodeJS的前后端分离的思考与实践(五)多终端适配
2014/09/26 NodeJs
node.js中的require使用详解
2014/12/15 Javascript
JavaScript学习笔记之数组随机排序
2016/03/23 Javascript
基于JavaScript实现随机颜色输入框
2016/12/10 Javascript
nodejs多版本管理总结
2018/04/03 NodeJs
为什么使用koa2搭建微信第三方公众平台的原因
2018/05/16 Javascript
JS异步执行结果获取的3种解决方式
2019/02/19 Javascript
详解可以用在VS Code中的正则表达式小技巧
2019/05/14 Javascript
JQuery复选框全选效果如何实现
2020/05/08 jQuery
vue 实现一个简单的全局调用弹窗案例
2020/09/10 Javascript
[44:04]OG vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
在Python的setuptools框架下生成egg的教程
2015/04/13 Python
python中找出numpy array数组的最值及其索引方法
2018/04/17 Python
python中yaml配置文件模块的使用详解
2018/04/27 Python
python版本单链表实现代码
2018/09/28 Python
python实现嵌套列表平铺的两种方法
2018/11/08 Python
python定时按日期备份MySQL数据并压缩
2019/04/19 Python
解决Python命令行下退格,删除,方向键乱码(亲测有效)
2020/01/16 Python
谈谈Python:为什么类中的私有属性可以在外部赋值并访问
2020/03/05 Python
python filecmp.dircmp实现递归比对两个目录的方法
2020/05/22 Python
Python基于xlutils修改表格内容过程解析
2020/07/28 Python
Python sqlalchemy时间戳及密码管理实现代码详解
2020/08/01 Python
利用 Canvas实现绘画一个未闭合的带进度条的圆环
2019/07/26 HTML / CSS
美国设计师精美珠宝购物网:Netaya
2016/08/28 全球购物
农村优秀教师事迹材料
2014/08/27 职场文书
意外死亡赔偿协议书
2014/10/14 职场文书
2015年世界水日活动总结
2015/02/09 职场文书
2015年服务员工作总结
2015/04/08 职场文书
女方家长婚礼答谢词
2015/09/29 职场文书
动画《平凡职业成就世界最强》宣布制作OVA
2022/04/01 日漫