大家知道，jQuery里面的bind方法是用来绑定事件处理的，典型用法如下：
$('选择器').bind('事件类型',function(event){
//这里是处理函数
});
在OAOP式系统中，需要大量的前台JS处理，这往往涉及到许多JS文件。限于性能考虑，不应该把所有相关的JS一次性加载过来。当然，解决办法有很多，在下在这里模仿bind的方式提供一种新的事件绑定处理脚本方式。初步设想是，将事件处理方法写入一个单独的脚本中，然后在事件触发时再去调用该脚本来实现事件处理。该插件的名称命名为bd，那么它的效果应该像这样：
$('选择器').bd('事件类型','JS脚本路径');
一个典型样例如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>测试页面</title>
<script type="text/javascript" src="../lib/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../bd.js"></script>
<script type="text/javascript">
$(function(){
$('#t1').bd('click','handlers/h1.js',{p1:'这是传入的参数1'});
});
</script>
</head>
<body>
<a id="t1" href="#">点击显示传入参数</a>
</body>
</html>
而远程处理脚本handlers/h1.js的代码如下：
$.bd(function(event){
alert(event.data.p1);
});
可以看到远程脚本除了用$.bd()包裹之外，里面的方法和bind方法的事件处理方法完全一致。
如果能组织好相关的处理脚本，那么完全可以将所有的业务处理代码组织到相关的远程处理脚本中，用目录来分类，使系统开发变得简单可靠。
这个想法已经实现，更多样例及实现代码参见附件。
插件源代码如下：
jQuery.extend({
/**
* 用于注册事件处理方法，在JS文件中写入$.bd(function(event){//自己的业务代码，this指调用的元素,event是触发的事件})，就可以触发导入;
*/
bd : function(_h) {
$(window).data('$.bd:h:' + $(window).data('$.bd:p:'), _h);// 注册方法
}
});
jQuery.fn.extend({
/**
* 根据事件触发执行相关的JS文件
*
* @param type 事件类型
* @param data 事件参数
* @param url JS文件路径或者事件处理函数
*/
bd : function(type, url, data) {
return $(this)._bd(type, url, data, true);
},
/**
* 根据事件触发执行相关的JS文件（仅一次）
*
* @param type 事件类型
* @param data 事件参数
* @param url JS文件路径或者事件处理函数
*/
bd1 : function(type, url, data) {
return $(this)._bd(type, url, data, false);
},
/**
* 根据事件触发执行相关的JS文件
*
* @param type 事件类型
* @param data 事件参数
* @param url JS文件路径或者事件处理函数
* @param loop 是否循环执行标志位，false表示只执行一次
*/
_bd : function(type, url, data, loop) {
var $this = $(this);
var result = false;
$.each([url,$(window).data('$.bd:h:' + url)],function(i,_h){
if($.isFunction(_h)){
if (loop) {
result = $this.bind(type, data, _h);
} else {
result = $this.one(type, data, _h);
}
}
});
if(result){
return result;
}
$(this).data('$.unbd:'+type,'');
var _f = function(event){
var $this = $(this);
var data = event.data;
if($this.data('$.unbd:'+data.type)===data.url){//已经取消绑定
return;
}
var _h = $(window).data('$.bd:h:' + data.url);
if(!$.isFunction(_h)){
$(window).data('$.bd:p:', data.url);
$.ajax({
url : data.url,
dataType : "script",
async : false,
success : function(){
$this.data("$.bd:o:").unbind(data.type,_f);
}
});
_h = $(window).data('$.bd:h:' + data.url);
}
if($.isFunction(_h)){
if(data.loop){
$this.data("$.bd:o:")._bd(data.type, data.url,data.data, data.loop);
}
$this["$.bd:_h"]=_h;
event.data = data.data;
event.handler = _h;
return $this["$.bd:_h"](event);
}
return false;
}
return $this.data("$.bd:o:",$this).one(type,{
type : type,
data : data,
url : url,
loop : loop
},_f);
},
/**
* 取消绑定
*
* @param type 执行类型
* @param p JS文件路径或者事件处理函数
*/
unbd : function(type, p) {
$(this).data('$.unbd:'+type,p);
var h = $.isFunction(p)?p:$(window).data('$.bd:h:' + p);// 获取方法
if($.isFunction(h)){
$(this).unbind(type,h);
}
return $(this);
}
});
注：附件中的样例不能直接在GOOGLE浏览器中运行，须放到服务器中，其它浏览器无此限制。
PS：注册之后苦等了三天，小弟首次发帖，希望多多鼓励支持:-)
PS2：做了一点调整，修正第一次加载时event.handler不正确的问题以及bd1执行两次的问题。
PS2：修正了取消绑定可能无效的问题，另外做了一些优化。
PS3：修正了取消绑定后恢复绑定无效的问题，增加了样例。
分享到：
- 2010-07-22 09:37
- 浏览 1610
- 评论(8)
- 论坛回复 / 浏览 (7 / 4751)
- 查看更多
，居然还没人回复！
相关推荐
Toxi Oxy Pro 便携式气体检测仪参考手册 使用说明书
官方的的说明书资料，部分视频说明在这里： https://www.bilibili.com/video/BV1Fz4y1d7rn/?spm_id_from=333.999.0.0&vd_source=13dc65dbb4ac9127d9af36e7b281220e
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
2023商业银行数据资产体系白皮书 目录 第 1 章 数据资产化与数据要素市场化相辅相成，相互促进 第 2 章 数据资产化是企业数据治理向上演进的必经之路 第 3 章 数据资产体系发展概述 第 4 章 “三位一体”数据资产体系的构思 4.1“三位一体”数据资产体系的构成与工作机制 数据资产管理 数据资产运营 数据资产评价 数据资产体系工作机制 4.2“三位一体”数据资产体系的相互作用关系 4.3“三位一体”数据资产体系的构建 4.4“三位一体”数据资产体系的优势 第 5 章 商业银行数据资产体系建设实践 5.1商业银行开展数据资产体系建设的背景和目标 5.2商业银行数据资产体系建设的工作步骤 5.3上海银行数据资产体系建设实践的主要成果 第 6 章 数据要素流通市场赋能企业数据资产化 6.1全国多层次数据要素市场的建设 6.2上海数据交易所赋能企业数据资产化 6.3数据要素流通交易市场赋能企业数据资产化的展望 第 7 章 未来演进与展望
大学生毕业设计、大学生课程设计作业
车辆销售数据Python爬取并做数据分析，项目源码注解清晰一看就懂
毕业设计：基于SSM的mysql_学生社团管理系统（源码 + 数据库 + 说明文档） 第2章 主要技术和工具介绍 1 2.1 JSP语言 1 2.2 MySQL数据库 1 2.3 jsp技术 2 2.4ssm简介 3 第3章 系统分析 1 3.1可行性分析 1 3.1.1经济可行性 1 3.1.2技术可行性 1 3.1.3操作可行性 1 3.2需求分析 1 3.3业务流程分析 2 3.4数据流程分析 3 第4章 系统设计 5 4.1系统结构设计 5 4.2功能模块设计 5 4.3数据库设计 6 4.3.1数据库设计概述 6 4.3.1概念设计 6 4.3.2表设计 7 第5章 系统实现 15 5.1基本任务 15 5.2登录模块的实现 15 5.2.1首页实现 15 5.2.2管理员后台登录 16 5.3用户模块的实现 19 5.3.1注册模块及登录的实现 19 5.2.2入团模块的实现 21 5.2.3场地预约模块的实现 22 5.4管理员模块的实现 24 5.4.1系统用户管理模块的实现 24 5.4.2活动公告管理模块的实现 26 5.5社团模块的实现 28 5.5.1活动信息
大健康零售业务O2O数字化战略规划方案.pptx
数据中台项目主要岗位及其职责和任务
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
流程制造行业数字化智能工厂总体规划建设方案.pptx
c语言学生成绩管理系统源码.zip
DEV-C++-5.11下载链接
电器租赁小程序.zip
学生成绩管理系统 数据结构与算法课程设计 C++
知乎小程序算法.zip
基于R语言SIR传染病传播的SIR模型，很全，可直接应用仿真模拟.rar
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
广东工业大学工程管理