很多人可能會有個疑問，Jscex和其他類庫共同使用或者語法混用時，會不會出現沖突或者異常？那么我們就來做個嘗試吧!

我們使用tab插件：

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

后來，官網幫這個tab插件擴展了一個自動切換的功能，只需要這樣寫就行：

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

擴展的代碼如下：

$.extend($.ui.tabs.prototype, {  
            rotation: null,  
            rotate: function (ms, continuing) {  
                var self = this,  
o = this.options;  
                var rotate = self._rotate || (self._rotate = function (e) {  
                    clearTimeout(self.rotation);  
                    self.rotation = setTimeout(function () {  
                        var t = o.selected;  
                        self.select(++t < self.anchors.length ? t : 0);  
                    }, ms);  
                    if (e) {  
                        e.stopPropagation();  
                    }  
                });  
                var stop = self._unrotate || (self._unrotate = !continuing  
? function (e) {  
    if (e.clientX) { // in case of a true click  
        self.rotate(null);  
    }  
}  
: function (e) {  
    t = o.selected;  
    rotate();  
});  
                // start rotation  
                if (ms) {  
                    this.element.bind("tabsshow", rotate);  
                    this.anchors.bind(o.event + ".tabs", stop);  
                    rotate();  
                    // stop rotation  
                } else {  
                    clearTimeout(self.rotation);  
                    this.element.unbind("tabsshow", rotate);  
                    this.anchors.unbind(o.event + ".tabs", stop);  
                    delete this._rotate;  
                    delete this._unrotate;  
                }  
                return this;  
            }  
        }); 

依然是那么費解的代碼！在官方沒有擴展之前，我們可以用Jscex介樣子實現：

var swicthAsync = eval(Jscex.compile("async", function () {  
            var tabCount = $("#tabs ul li").length;  
            while (true) {  
                for (var i = 0; i < tabCount; i++) {  
                    $await(Jscex.Async.sleep(2000));  
                    $('#tabs').tabs({ selected: i });  
                }  
            }  
        }));  
        $(function () {  
            $("#tabs").tabs();  
            swicthAsync().start();  
        }); 

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

$.extend($.ui.tabs.prototype, {  
            rotation: null,  
            rotate: function (ms, continuing) {  
                var self = this,  
o = this.options;  
                var swicthAsync = eval(Jscex.compile("async", function () {  
                    while (true) {  
                        for (var i = 0; i < self.anchors.length; i++) {  
                            $await(Jscex.Async.sleep(ms));  
                            self.select(i);  
                        }  
                    }  
                }));  
                swicthAsync().start();  
                return this;  
            }  
        }); 

但是continuing參數暫時沒有起作用，該參數是決定用戶在選中后是否繼續循環下去，這個就留個大家自己去完善吧~~~~

新的Jscex 庫，請上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如何實現頁面自適