Ming Apps

Posts Tagged ‘jquery

rewardjs-header

Link: http://rewardjs.com/

過了一年的實習,

結果就Debug了一年哈~

可惜,

Debug的能力看來在這一年返回學習生涯浪費了~

今次為大家介紹的是,

Debug可以贏大獎!

iPad2, Xbox, 好多好多獎品!

暫時要大家懂得為jQuery UI debug~

一至五每日debug最多的,

一星期debug最多的,

一個月內debug最多的

各有各獎品~

是誰想到這個debug大計的呢?

很有趣的concept~

加油啊各位~

jQuery logo

為何1.6會出得這樣快呢?

Google CDN: http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js

Microsoft CDN: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js

這次的Version最明顯的更新,

莫過於Data, Attr和Val三個functions的速度快了許多,

其中Attr的function快了近兩倍!

.

令外對我較吸引的更新是Relative CSS,

意思是可以在不同的style attribut上直接加上你所需要的數值,

例如:


$("div").css("right", "+=28px");

還有更多的效果,Performance Improvements和Bug Fixed,

jQuery, 教人如何不愛你? :P

網址:  http://jquerymobile.com/

jQuery logo

大家對jQuery的名字應該不陌生,

今早介紹的都是jQuery,

不過是jQuery Mobile!

jQuery Mobile顧名思義就是以jQuery技術建立Mobile Apps了~

大家可以利用Web的技術設計Mobile Web Apps的介面,

即是不用學過另一種Language,

已相應學懂了Mobile Apps吧!

最厲害的是他是Cross Platform的!

能在iPhone, Android, Blackberry, Symbian, Windows Phone…

哇,全部兼容!

大家有Mobile上網的即管試一下她的Demo Site!

是因為網頁技術的兼容大家已經處理得太多,

在jQuery Mobile才做得如此快吧~ :P

令人震驚的是,

Mozilla, Nokia 同 Adobe重有唔少公司都係jQuery Mobile既贊助者!

Adobe早前推出左html5 support既Dreamweaver,

如果連mobile apps都support既Dreamweaver真係唔講得笑!

試想一下將來不用再利用objective-c寫介面

全程利用網頁技術便能寫Program,

世界將會發生巨變,因為寫網頁實在太方便了!

當然大家仍需要處理每個UI的設計如何有效針對User Experience了~

學好UI Design Pattern吧~

jQuery logo
原文網址: http://blog.jquery.com/2011/03/31/jquery-152-released/

 

大家已經可以利用Google CDN及Microsoft CDN 載入jQuery 1.5.2:

Google CDN: https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js
Microsoft CDN: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.2.min.js

 

jQuery是我實習時第一種接觸到的javascript library/framework,

使用起來極其方便,

大部份function可以chain起來,

更了解更多AJAX和callback的使用。

 

jQuery 的update速度不錯,

筆者上年實習的時候剛出1.4,

那時還說運算速度上有很大的提升。

 

今次一看,原來在今年1月尾推出了jQuery 1.5,

3月31號剛推出了 jQuery 1.5.2!

Version 1.5與之前version有兩大分別,

一個是Ajax Rewrite,另一個是Deferred Object.

 

jQuery新增了一個jqXHR的Object,

當大家開始Ajax call,

return object正是jqXHR,

它可算是一個cross browser platform的XMLHttpRequest Object(superset of the XMLHTTPRequest object) ,

大家可以當正常Ajax call之外,

還有Statuscode(404! page not found!),

還有很多可以參考

 

Deferred Object又是是甚麼呢?

Deferred Object原意是在function中實現callback function,

亦支援chainable functions,

是first in first out的形式,

按先後次序進行function call.

 

大家可以到: http://jsfiddle.net/hN5Eb/1/ 測試一下Deferred Object是甚麼。

$.when( x(), y(), z()) 可以輸入多個function按次序進行這些function,

大家便可以跟據Event不同的情況作出相應動作,

例如大家可在進行中run其他function(Deferred.then),

完成callback(Deferred.done)等多個default function.

 

Ajax方面亦都包含了deferred object,

大家可以看看原來jquery的ajax call是:

$.post("test.php",{func:"getNameAndTime"},
function(data){
alert(data.name); // John
console.log(data.time); //  2pm
}, "json");

但現在你則可以利用deferred object寫成 :

// $.get, an ajax request, is asynchronous by default.
var req = $.get('foo.htm')
.success(function( response ){
// do something with the response
})
.error(function(){
// do something if the request failed
});

// this might execute before the $.get() above is complete
doSomethingAwesome();

// something additional to execute upon success,
// which might, or might not,
// have fired by now.  With $.ajax deferreds built-in, it doesn't matter.
req.success(function( response ){
// do something more with the response
// this will fire when success normally fires, or fire immediately
// if prior success callbacks have already fired
});

Success, error,或者 complete handler 已經可以不只一個,

而且可以以先後次序方式,自己管理callback 次序。

 

大家可以從上面的example看到,

callback已經可以在AJAX request,

甚至係其他function完結(Deferred.done)後,

進行你的callback.

從前的ajax callback總是要密密麻麻在function(data)中進行,

這種寫法看來是更加簡潔和具直覺性,

是個相當好的「Reordering」哈哈~

 

絕對建議大家到呢一個jQuery tutorial on deferred object,

了解更多deferred object的使用。

 

或者筆者遲些將其翻譯成中文吧~


%d 位部落客按了讚: