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 相关文章推荐
js查找父节点的简单方法
Jun 28 Javascript
jQuery第三课 修改元素属性及内容的代码
Mar 14 Javascript
jQuery参数列表集合
Apr 06 Javascript
js跳转页面方法总结
Jan 29 Javascript
node.js解决获取图片真实文件类型的问题
Dec 20 Javascript
jQuery查看选中对象HTML代码的方法
Jun 17 Javascript
JavaScript文件的同步和异步加载的实现代码
Aug 19 Javascript
聊聊那些使用前端Javascript实现的机器学习类库
Sep 18 Javascript
vuex进阶知识点巩固
May 20 Javascript
JS实现数组去重,显示重复元素及个数的方法示例
Jan 21 Javascript
axios如何利用promise无痛刷新token的实现方法
Aug 27 Javascript
js回溯法计算最佳旅行线路代码实例
Sep 11 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
手把手教你使用DedeCms的采集的图文教程
2007/03/11 PHP
PHP 数组遍历顺序理解
2009/09/09 PHP
PHP 全角转半角实现代码
2010/05/16 PHP
php5 apache 2.2 webservice 创建与配置(java)
2011/01/27 PHP
php开启安全模式后禁用的函数集合
2011/06/26 PHP
php去除换行符的方法小结(PHP_EOL变量的使用)
2013/02/16 PHP
jquery不支持toggle()高(新)版本的问题解决
2016/09/24 PHP
利用php生成验证码
2017/02/23 PHP
PHP实现表单提交数据的验证处理功能【防SQL注入和XSS攻击等】
2017/07/21 PHP
常见的5个PHP编码小陋习以及优化实例讲解
2021/02/27 PHP
一实用的实现table排序的Javascript类库
2007/09/12 Javascript
JavaScript 构造函数 面相对象学习必备知识
2010/06/09 Javascript
Jquery的Tabs内容轮换效果实现代码,几行搞定
2014/02/12 Javascript
JavaScript中String.prototype用法实例
2015/05/20 Javascript
javascript数据类型验证方法
2015/12/31 Javascript
关于安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法
2016/05/17 Javascript
详解Angularjs在控制器(controller.js)中使用过滤器($filter)格式化日期/时间实例
2017/02/17 Javascript
ionic2 tabs 图标自定义实例
2017/03/08 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
2017/07/24 Javascript
原生JavaScript实现remove()和recover()功能示例
2018/07/24 Javascript
node.js 微信开发之定时获取access_token
2020/02/07 Javascript
Vue使用自定义指令实现拖拽行为实例分析
2020/06/06 Javascript
详解vue高级特性
2020/06/09 Javascript
轻松掌握python设计模式之访问者模式
2016/11/18 Python
使用Python的Django和layim实现即时通讯的方法
2018/05/25 Python
Python 爬虫实现增加播客访问量的方法实现
2019/10/31 Python
Django 删除upload_to文件的步骤
2020/03/30 Python
canvas实现有递增动画的环形进度条的实现方法
2019/07/10 HTML / CSS
HTML5 Blob 实现文件下载功能的示例代码
2019/11/29 HTML / CSS
AJAX应用和传统Web应用有什么不同
2013/08/24 面试题
普通员工辞职信
2014/01/17 职场文书
体育课外活动总结
2014/07/08 职场文书
乡镇干部先进性教育活动个人整改措施
2014/09/16 职场文书
Java中使用Filter过滤器的方法
2021/06/28 Java/Android
Dashboard管理Kubernetes集群与API访问配置
2022/04/01 Servers
Python可视化神器pyecharts之绘制地理图表练习
2022/07/07 Python