自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

JS異步編程三:Jscex無創(chuàng)痕切入jQUI

開發(fā) 前端
很多人可能會(huì)有個(gè)疑問,Jscex和其他類庫共同使用或者語法混用時(shí),會(huì)不會(huì)出現(xiàn)沖突或者異常?那么我們就來做個(gè)嘗試吧!

很多人可能會(huì)有個(gè)疑問,Jscex和其他類庫共同使用或者語法混用時(shí),會(huì)不會(huì)出現(xiàn)沖突或者異常?那么我們就來做個(gè)嘗試吧!

我們使用tab插件:

  1. $(function () {  
  2. $("#tabs").tabs({ event: "mouseover" });  
  3. });  

后來,官網(wǎng)幫這個(gè)tab插件擴(kuò)展了一個(gè)自動(dòng)切換的功能,只需要這樣寫就行:

  1. $(function ()   
  2. {var t = $("#tabs").tabs();  
  3. t.tabs("rotate", 3000, false);  
  4. }); 

擴(kuò)展的代碼如下:

  1. $.extend($.ui.tabs.prototype, {  
  2.             rotation: null,  
  3.             rotate: function (ms, continuing) {  
  4.                 var self = this,  
  5. o = this.options;  
  6.                 var rotate = self._rotate || (self._rotate = function (e) {  
  7.                     clearTimeout(self.rotation);  
  8.                     self.rotation = setTimeout(function () {  
  9.                         var t = o.selected;  
  10.                         self.select(++t < self.anchors.length ? t : 0);  
  11.                     }, ms);  
  12.                     if (e) {  
  13.                         e.stopPropagation();  
  14.                     }  
  15.                 });  
  16.                 var stop = self._unrotate || (self._unrotate = !continuing  
  17. function (e) {  
  18.     if (e.clientX) { // in case of a true click  
  19.         self.rotate(null);  
  20.     }  
  21. }  
  22. function (e) {  
  23.     t = o.selected;  
  24.     rotate();  
  25. });  
  26.                 // start rotation  
  27.                 if (ms) {  
  28.                     this.element.bind("tabsshow", rotate);  
  29.                     this.anchors.bind(o.event + ".tabs", stop);  
  30.                     rotate();  
  31.                     // stop rotation  
  32.                 } else {  
  33.                     clearTimeout(self.rotation);  
  34.                     this.element.unbind("tabsshow", rotate);  
  35.                     this.anchors.unbind(o.event + ".tabs", stop);  
  36.                     delete this._rotate;  
  37.                     delete this._unrotate;  
  38.                 }  
  39.                 return this;  
  40.             }  
  41.         }); 

依然是那么費(fèi)解的代碼!在官方?jīng)]有擴(kuò)展之前,我們可以用Jscex介樣子實(shí)現(xiàn):

  1. var swicthAsync = eval(Jscex.compile("async"function () {  
  2.             var tabCount = $("#tabs ul li").length;  
  3.             while (true) {  
  4.                 for (var i = 0; i < tabCount; i++) {  
  5.                     $await(Jscex.Async.sleep(2000));  
  6.                     $('#tabs').tabs({ selected: i });  
  7.                 }  
  8.             }  
  9.         }));  
  10.         $(function () {  
  11.             $("#tabs").tabs();  
  12.             swicthAsync().start();  
  13.         }); 

可以看得出來,這樣的話Jscex沒有對(duì)JqueryUI做任何介入,Jscex只是外部控制的一層殼。這樣無法對(duì)測(cè)試出Jscex是否能與沖突或者異常,那么,我們就來用Jscex重寫官方的擴(kuò)展方法吧!

  1. $.extend($.ui.tabs.prototype, {  
  2.             rotation: null,  
  3.             rotate: function (ms, continuing) {  
  4.                 var self = this,  
  5. o = this.options;  
  6.                 var swicthAsync = eval(Jscex.compile("async"function () {  
  7.                     while (true) {  
  8.                         for (var i = 0; i < self.anchors.length; i++) {  
  9.                             $await(Jscex.Async.sleep(ms));  
  10.                             self.select(i);  
  11.                         }  
  12.                     }  
  13.                 }));  
  14.                 swicthAsync().start();  
  15.                 return this;  
  16.             }  
  17.         }); 

但是continuing參數(shù)暫時(shí)沒有起作用,該參數(shù)是決定用戶在選中后是否繼續(xù)循環(huán)下去,這個(gè)就留個(gè)大家自己去完善吧~~~~

新的Jscex 庫,請(qǐng)上https://github.com/JeffreyZhao/jscex或者http://www.sndacode.com/projects/jscex/wiki下載。

原文鏈接:http://www.cnblogs.com/iamzhanglei/archive/2011/08/21/2148628.html

【編輯推薦】

  1. JS異步編程一:用Jscex畫圓
  2. JS異步編程二:自由落體
  3. JS異步編程四:Jscex+jQ打造游戲力度條
  4. JS異步編程五:Jscex制作憤怒的小鳥
  5. 看JavaScript如何實(shí)現(xiàn)頁面自適
責(zé)任編輯:張偉 來源: 當(dāng)耐特磚家的博客
相關(guān)推薦

2011-11-11 13:38:39

Jscex

2012-06-14 13:40:04

JavaScript

2012-06-14 14:42:42

JavaScript

2012-06-14 14:09:58

JavaScript

2011-11-10 10:23:56

Jscex

2011-07-27 14:10:43

javascript

2011-11-16 13:22:38

Jscex

2011-11-17 16:14:25

Jscex

2019-01-17 10:58:52

JS異步編程前端

2012-06-14 13:55:39

JavaScript

2013-04-01 15:38:54

異步編程異步編程模型

2023-05-09 08:28:44

Go語言并發(fā)編程

2021-03-23 07:56:54

JS基礎(chǔ)同步異步編程EventLoop底層

2020-10-15 13:29:57

javascript

2013-04-01 15:25:41

異步編程異步EMP

2011-10-18 10:17:13

Node.js

2011-02-22 09:09:21

.NETAsync CTP異步

2011-02-22 08:49:16

.NET同步異步

2016-09-07 20:43:36

Javascript異步編程

2017-07-13 12:12:19

前端JavaScript異步編程
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)