首頁(yè)

從零開(kāi)始學(xué)習(xí)jQuery (十一) 實(shí)戰(zhàn)表單驗(yàn)證與自動(dòng)完成提示插件

藍(lán)藍(lán)設(shè)計(jì)的小編

一.摘要

本系列文章將帶您進(jìn)入jQuery的精彩世界, 其中有很多作者具體的使用經(jīng)驗(yàn)和解決方案,  即使你會(huì)使用jQuery也能在閱讀中發(fā)現(xiàn)些許秘籍.

本文是介紹兩個(gè)最常用的jQuery插件. 分別用于表單驗(yàn)證和自動(dòng)完成提示(類似google suggest).

 

二.前言

研究別人的作品真是一件花時(shí)間而且痛苦的過(guò)程. 當(dāng)然也和本人英文不好有關(guān). 總覺(jué)得控件作者寫(xiě)了很多文檔但是都不夠系統(tǒng), 需要深入研究很多的實(shí)例后才能了解作者的思路.所以學(xué)習(xí)和研究一個(gè)插件需要很高成本, 如果發(fā)現(xiàn)了Bug并修復(fù)需要的成本也是未知數(shù)(本次我花了較少的時(shí)間解決了自動(dòng)完成提示插件的一個(gè)中文bug, 但是如果復(fù)雜的bug就不會(huì)這么簡(jiǎn)單了.).

對(duì)于簡(jiǎn)單應(yīng)用我首先推薦上文中的jQuery UI. 但是jQuery UI解決的問(wèn)題有限. 使用jQuery插件是我們最后的一個(gè)好辦法---還算是好辦法, 起碼比自己開(kāi)發(fā)要好吧?

很多jQuery的插件編碼異常優(yōu)美, 看一看藝龍首頁(yè)現(xiàn)在的城市輸入框控件, 除了需要為輸入框手工添加很多很多屬性(onkeyup, onkeydown等等), 而且還不夠通用, 占用服務(wù)器資源和網(wǎng)絡(luò)資源.但是當(dāng)初也是花費(fèi)了很久的時(shí)間完成的作品.

站在巨人的肩膀上, 讓我感覺(jué)寫(xiě)腳本和寫(xiě)設(shè)計(jì)C#程序一樣, 都有高度和深度可以挖掘. 除了使用作者開(kāi)發(fā)好的功能, 還可以學(xué)習(xí)如何開(kāi)發(fā)和封裝javascript控件. 看過(guò)優(yōu)秀的jQuery插件作者的代碼和設(shè)計(jì)思想后, 常常自嘆設(shè)計(jì)水平差距居然如此之大, 增加自認(rèn)為腳本高手, 比較過(guò)后就是C#程序員和架構(gòu)師之間的差距.

希望大家通過(guò)本章節(jié)介紹的兩個(gè)插件, 除了學(xué)會(huì)如何使用,  還能夠略微領(lǐng)悟到如何封裝和設(shè)計(jì)javascript控件.

從零開(kāi)始學(xué)習(xí)jQuery (十) jQueryUI常用功能實(shí)戰(zhàn)

藍(lán)藍(lán)設(shè)計(jì)的小編

一.摘要

本系列文章將帶您進(jìn)入jQuery的精彩世界, 其中有很多作者具體的使用經(jīng)驗(yàn)和解決方案,  即使你會(huì)使用jQuery也能在閱讀中發(fā)現(xiàn)些許秘籍.

本文是實(shí)戰(zhàn)篇. 使用jQueryUI完成制作網(wǎng)站的大部分常用功能. 

 

二.前言

經(jīng)過(guò)公司內(nèi)部收集, 整理了一些經(jīng)常使用javascript實(shí)現(xiàn)的功能.  實(shí)現(xiàn)這些功能的主角不是讓人眼花繚亂的jQuery插件,  而是jQuery UI.

如果你還在為了一個(gè)小小的而去下載并安裝插件, 發(fā)現(xiàn)Bug還沒(méi)有人替你解決. 記住插件是我們沒(méi)有辦法的最后選擇.

使用插件有太多的壞處:

1.不利于維護(hù)

2.增加頁(yè)面大小

3.不利于成員間交流共享,具有學(xué)習(xí)成本.

4.不夠健壯, 不能保證插件版本一直更新并修復(fù)所有問(wèn)題.

下面就引入今天的主角:jQuery UI

 

從零開(kāi)始學(xué)習(xí)jQuery (九) jQuery工具函數(shù)

藍(lán)藍(lán)設(shè)計(jì)的小編

一.摘要

本系列文章將帶您進(jìn)入jQuery的精彩世界, 其中有很多作者具體的使用經(jīng)驗(yàn)和解決方案,  即使你會(huì)使用jQuery也能在閱讀中發(fā)現(xiàn)些許秘籍.

我們經(jīng)常要使用腳本處理各種業(yè)務(wù)邏輯, 最常見(jiàn)的就是數(shù)組和對(duì)象的操作. jQuery工具函數(shù)為我們操作對(duì)象和數(shù)組提供了便利條件.

 

二.前言

大部分人僅僅使用jQuery的選擇器選擇對(duì)象, 或者實(shí)現(xiàn)頁(yè)面動(dòng)畫(huà)效果. 在處理業(yè)務(wù)邏輯時(shí)常常自己編寫(xiě)很多算法. 本文提醒各位jQuery也能提高我們操作對(duì)象和數(shù)組的效率. 并且可以將一些常用算法擴(kuò)充到j(luò)Query工具函數(shù)中, 實(shí)現(xiàn)腳本函數(shù)的復(fù)用.

 

從零開(kāi)始學(xué)習(xí)jQuery (八) 插播:jQuery實(shí)施方案

藍(lán)藍(lán)設(shè)計(jì)的小編

一.摘要

本系列文章將帶您進(jìn)入jQuery的精彩世界, 其中有很多作者具體的使用經(jīng)驗(yàn)和解決方案,  即使你會(huì)使用jQuery也能在閱讀中發(fā)現(xiàn)些許秘籍.

本篇文章屬于臨時(shí)插播,  用于介紹我在本公司的jQuery實(shí)施方案. 

 

二.前言

有了前幾章扎實(shí)的基礎(chǔ)知識(shí)我們已經(jīng)可以在項(xiàng)目中投入使用jQuery了.再繼續(xù)深入學(xué)習(xí)jQuery前插播一下我的jQuery實(shí)施方案.

每個(gè)公司的情況都不同.比如我們公司的頁(yè)面文件都為用戶控件, 物理路徑和虛擬路徑?jīng)]有絕對(duì)的關(guān)系, 所以無(wú)法使用相對(duì)路徑(否則生產(chǎn)環(huán)境中會(huì)找不到文件).  項(xiàng)目繁多, 同一個(gè)虛擬目錄的不同文件夾對(duì)應(yīng)不同項(xiàng)目工程等等.

此方案并不是通用的, 但是有些方法可以借鑒, 同時(shí)也是希望能和大家一起討論幫忙指正. 

從零開(kāi)始學(xué)習(xí)jQuery (七) jQuery動(dòng)畫(huà)-讓頁(yè)面動(dòng)起來(lái)!

藍(lán)藍(lán)設(shè)計(jì)的小編

一.摘要

本系列文章將帶您進(jìn)入jQuery的精彩世界, 其中有很多作者具體的使用經(jīng)驗(yàn)和解決方案,  即使你會(huì)使用jQuery也能在閱讀中發(fā)現(xiàn)些許秘籍.

開(kāi)發(fā)人員一直痛疼做動(dòng)畫(huà). 但是有了jQuery你會(huì)瞬間成為別人(那些不知道jQuery的人)眼里的動(dòng)畫(huà)高手! 本文將介紹jQuery的動(dòng)畫(huà)相關(guān)函數(shù).原來(lái)做動(dòng)畫(huà)如此簡(jiǎn)單!

 

二.前言

本系列文章的實(shí)例都是針對(duì)某一個(gè)技術(shù)細(xì)節(jié)的, 因?yàn)槲覀円獙W(xué)習(xí)的是基礎(chǔ)知識(shí), 雖然總有人希望要復(fù)雜一些的應(yīng)用示例, 但是我想還是讓我們先把基礎(chǔ)打牢,  有了扎實(shí)的基礎(chǔ)憑借每個(gè)人的智慧一定能創(chuàng)造出更多更好的應(yīng)用.

就在寫(xiě)這篇文章的前幾天, 還有不止一個(gè)同事在為了"彈出層"效果而犯愁. 但是以后再面對(duì)這樣的功能看過(guò)本篇文章的每一個(gè)人都可以開(kāi)心的微笑了. jQuery,  make work easy !

 

從零開(kāi)始學(xué)習(xí)jQuery (六) AJAX快餐

藍(lán)藍(lán)設(shè)計(jì)的小編

一.摘要

本系列文章將帶您進(jìn)入jQuery的精彩世界, 其中有很多作者具體的使用經(jīng)驗(yàn)和解決方案,  即使你會(huì)使用jQuery也能在閱讀中發(fā)現(xiàn)些許秘籍.

本篇文章講解如何使用jQuery方便快捷的實(shí)現(xiàn)Ajax功能.統(tǒng)一所有開(kāi)發(fā)人員使用Ajax的方式.

 

二.前言

Ajax讓用戶頁(yè)面豐富起來(lái), 增強(qiáng)了用戶體驗(yàn). 使用Ajax是所有Web開(kāi)發(fā)的必修課. 雖然Ajax技術(shù)并不復(fù)雜, 但是實(shí)現(xiàn)方式還是會(huì)因?yàn)槊總€(gè)開(kāi)發(fā)人員的而有所差異.jQuery提供了一系列Ajax函數(shù)來(lái)幫助我們統(tǒng)一這種差異, 并且讓調(diào)用Ajax更加簡(jiǎn)單.

 

從內(nèi)觀禪修悟出的產(chǎn)品哲學(xué)

藍(lán)藍(lán)設(shè)計(jì)的小編

藍(lán)藍(lán)注:很久以前,有一個(gè)很好的朋友去國(guó)內(nèi)的內(nèi)觀中文呆了十天,回來(lái)后的他與以前不同,多了一些寂靜觀喜,總是以喜悅的態(tài)度去看人事物,不糾結(jié),不為難自己,也不強(qiáng)求別人。他一直對(duì)我們講要我們也去禪修一下。我口上答應(yīng)著,內(nèi)心嘀咕著:去哪兒修行嗎?對(duì)公司、對(duì)工作、對(duì)家庭有好處嗎?十天很久也。

今天看到這篇文章,有心人去哪里都有領(lǐng)悟,能以文章表示出來(lái),是一種能力。

這文中三點(diǎn):1、與其相信用戶告訴你他要什么,不如靠自己的對(duì)產(chǎn)品的覺(jué)知——用戶觀察為先不一定正確。

我是這樣理解的:覺(jué)知比理性調(diào)查更有用,有人信覺(jué)知,有人信調(diào)查。你問(wèn)出答案,對(duì)方回答出來(lái)的未必是真心的,有可能說(shuō)慌。有一部片子 lie to  me,是講以人的身體語(yǔ)言去覺(jué)知人的思想的,高水平的覺(jué)知可看透人心。

2、平等地去看待假設(shè),它們本質(zhì)上是沒(méi)有區(qū)別的——保持對(duì)他人的同理心

我是這樣理解的:事無(wú)對(duì)錯(cuò),只看從什么角度對(duì)看,產(chǎn)品經(jīng)理保持無(wú)區(qū)別心的對(duì)待,從各角度理解體察,能理解別人,海納百川,從善如流。

3、以慈悲的態(tài)度對(duì)待用戶,人性化的設(shè)計(jì)——拒絕被動(dòng)的用戶黏度

我是這樣理解的:不強(qiáng)迫用戶,用吸引的方式達(dá)成,不用推薦及強(qiáng)買強(qiáng)賣達(dá)成。


日歷

鏈接

個(gè)人資料

存檔