- /*
- 用法1
- <div id='btn1'>按钮1<div>
- <script src='jquary.js'></script>
- <script src='my.js'>这个文件引入需要紧跟在在jquary后面</script>
- <script>
- $('#btn1').click(function(e){console.log(e);}, 1000); //每次点击生效后要等待1000毫秒下次点击才能生效
- </script>
- 方法2
- <div onclick='clickHandel(this, fn, [1, 2, 3])' click_ms='1000'>按钮2<div>
- <script src='jquary.js'></script>
- <script src='my.js'>这个文件引入需要紧跟在在jquary后面</script>
- <script>
- function fn(a, b, c) {
- alert(a+b+c);
- }
- </script>
- */
- 代理模式和策略模式:可以把原来的函数引用保存下来在自定义的函数里面调用,代理原来的,然后可以加一些处理策略,代码如下
- var oldClick = $.prototype.click;
- $.prototype.oldClick = oldClick;
- $.prototype.click = newClick;
- funtion newClick(callback, a, b, ...) {
- $(o).oldClick(function(e){
- handel(o, callback, e, a, b, ...);
- });
- }
- $.prototype.click = myClick; //修改默认的click函数
- my.js
- var buttonRefs = {};
- var index = 0;
- function handel(o, callback, paramsArr) {
- var delayMs = o.getAttribute('click_ms');
- if(!isNaN(delayMs)) {
- delayMs = Number(delayMs);
- for (var p in buttonRefs) {
- if (o == buttonRefs[p]) {
- return;
- }
- }
- if(!paramsArr || paramsArr.constructor != Array) {
- paramsArr = [];
- }
- callback.apply(o, paramsArr);
- buttonRefs[index++] = o;
- setTimeout(function (btn) {
- return function () {
- for (var p in buttonRefs) {
- if (btn === buttonRefs[p]) {
- delete buttonRefs[p];
- break;
- }
- }
- }
- }(o), delayMs);
- }else {
- callback.apply(o, paramsArr);
- }
- }
- function myClick(callback, clickMs) {
- if(!callback || callback.constructor != Function) {
- return;
- }
- var o = this[0];
- if(!o) {
- return;
- }
- if(clickMs && !isNaN(clickMs)) {
- o.setAttribute('click_ms', clickMs);
- }
- o.addEventListener('click', function (e) {
- handel(o, callback, [e]);
- });
- }
- function clickHandel(o, callback, paramsArr) {
- handel(o, callback, paramsArr);
- }
- $.prototype.click = myClick; //修改默认的click函数
覆盖jquay的默认方法,js函数节流
猜你喜欢
转载自blog.csdn.net/u012681635/article/details/79583360
今日推荐
周排行