jQuery ajax 路由和过滤器使用说明


Posted in Javascript onAugust 02, 2011

遗憾的是,我用到的一个遗留系统并没有做到这样。于是在客户端应用jQuery的ajaxPrefilter改造了一下调用方法。

<html> 
<head> 
<title>ajaxPrefilter demo</title> 
</head> 
<body> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
<script type="text/javascript"> 
var zoneAjaxUrl = '/ajax.php'; 
var zoneAjaxRoute = /\/ajax\/(\w+)\/(\w+)\/(\w+)(\?.*)?/; 
$.ajaxPrefilter(function( options, originalOptions, jqXHR ) { 
// console.log(options.url,'\n',originalOptions.url); 
var m = options.url.match(zoneAjaxRoute) 
if(m){ 
var routed = { 
dir : m[1], page : m[2], action : m[3], 
args : JSON.stringify(originalOptions.data) 
} 
options.url = zoneAjaxUrl+ (m[4]||''); 
options.data = $.param(routed); 
} 
}); 
var url = '/ajax/dir/page/action'; 
// var url = '/ajax/dir/page/action?a=1&b=2'; 
var url_jsonp = '/ajax/dir/page/action?callback=?'; 
// var url_jsonp = '/ajax/dir/page/action?a1=2&b1=3&diy_callback=?'; 
var data = { 
username: "abc@example.com", 
users : ['a','b'] 
} 
$.post(url,data); 
$.get(url,data); 
$.getJSON(url_jsonp,data); 
</script> 
</body> 
</html>

使用比对
// 改造之后 
$.post('/ajax/dir/page/action',{page:1}) 
// 改造之前 
$.post('/ajax.php',{ 
dir : 'dir', 
page : 'page', 
action : 'action', 
args : JSON.stringify({ page:1 }) 
});
Javascript 相关文章推荐
javascript 实现字符串反转的三种方法
Nov 23 Javascript
jQuery学习笔记之创建DOM元素
Jan 19 Javascript
详解JavaScript表单验证(E-mail 验证)
Mar 31 Javascript
BootstrapTable与KnockoutJS相结合实现增删改查功能【二】
May 10 Javascript
vue.js入门教程之基础语法小结
Sep 01 Javascript
JavaScript中Math对象的方法介绍
Jan 05 Javascript
Ionic+AngularJS实现登录和注册带验证功能
Feb 09 Javascript
Hexo已经看腻了,来手把手教你使用VuePress搭建个人博客
Apr 26 Javascript
微信小程序input框中加入小图标的实现方法
Jun 19 Javascript
VUE简单的定时器实时刷新的实现方法
Jan 20 Javascript
浅谈v-for 和 v-if 并用时筛选条件方法
Nov 07 Javascript
小程序使用分包的示例代码
Mar 23 Javascript
js禁止小键盘输入数字功能代码
Aug 01 #Javascript
js内置对象 学习笔记
Aug 01 #Javascript
DB.ASP 用Javascript写ASP很灵活很好用很easy
Jul 31 #Javascript
js动态加载以及确定加载完成的代码
Jul 31 #Javascript
JS按位非(~)运算符与~~运算符的理解分析
Jul 31 #Javascript
JS高级拖动技术 setCapture,releaseCapture
Jul 31 #Javascript
js中判断文本框是否为空的两种方法
Jul 31 #Javascript
You might like
收音机术语解释
2021/03/01 无线电
基于Zookeeper的使用详解
2013/05/02 PHP
Linux中为php配置伪静态
2014/12/17 PHP
php自定义加密与解密程序实例
2014/12/31 PHP
PHP 实现代码复用的一个方法 traits新特性
2015/02/22 PHP
php定义参数数量可变的函数用法实例
2015/03/16 PHP
php mysql 封装类实例代码
2016/09/18 PHP
jQuery 获取URL参数的插件
2010/03/04 Javascript
基于jquery的大众点评,分类导航实现代码
2011/08/23 Javascript
js设置cookie过期及清除浏览器对应名称的cookie
2013/10/24 Javascript
jQuery中extend函数详解
2015/07/13 Javascript
AngularJS 模块化详解及实例代码
2016/09/14 Javascript
Angular在一个页面中使用两个ng-app的方法
2017/02/20 Javascript
JS字符串按逗号和回车分隔的方法
2017/04/25 Javascript
ReactNative列表ListView的用法
2017/08/02 Javascript
浅谈在Vue-cli里基于axios封装复用请求
2017/11/06 Javascript
分析JavaScript数组操作难点
2017/12/18 Javascript
详解基于mpvue微信小程序下载远程图片到本地解决思路
2019/05/16 Javascript
通过循环优化 JavaScript 程序
2019/06/24 Javascript
微信小程序页面上下滚动效果
2020/11/18 Javascript
解决antd日期选择组件,添加value就无法点击下一年和下一月问题
2020/10/29 Javascript
wtfPython—Python中一组有趣微妙的代码【收藏】
2018/08/31 Python
django-rest-framework解析请求参数过程详解
2019/07/18 Python
python多线程扫描端口(线程池)
2019/09/04 Python
jupyter lab文件导出/下载方式
2020/04/22 Python
css3一个简易的 LED 数字时钟实现方法
2020/01/15 HTML / CSS
馥绿德雅美国官方网站:Rene Furterer头皮护理专家
2019/05/01 全球购物
SQL数据库笔试题
2016/03/08 面试题
学生感冒英文请假条
2014/02/04 职场文书
幼儿园元旦家长感言
2014/02/27 职场文书
学校感恩教育活动总结
2014/07/07 职场文书
个人剖析材料范文
2014/09/30 职场文书
瞿秋白纪念馆观后感
2015/06/10 职场文书
解除租赁合同协议书
2016/03/21 职场文书
MYSQL(电话号码,身份证)数据脱敏的实现
2021/05/28 MySQL
用Python编写简单的gRPC服务的详细过程
2021/07/04 Python