移動(dòng)端jquery,移動(dòng)端什么意思

移動(dòng)端開(kāi)發(fā) 用jquery 嗎

第一，看你PC端的需求了吧 如果PC端需要支持IE8版本 zepto和差不多大小的jquery2.0系列就不好用了 只能使用壓縮后100kb的jquery

為渝北等地區(qū)用戶提供了全套網(wǎng)頁(yè)設(shè)計(jì)制作服務(wù)，及渝北網(wǎng)站建設(shè)行業(yè)解決方案。主營(yíng)業(yè)務(wù)為網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計(jì)、渝北網(wǎng)站設(shè)計(jì)，以傳統(tǒng)方式定制建設(shè)網(wǎng)站，并提供域名空間備案等一條龍服務(wù)，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠(chéng)的服務(wù)。我們深信只要達(dá)到每一位用戶的要求，就會(huì)得到認(rèn)可，從而選擇與我們長(zhǎng)期合作。這樣，我們也可以走得更遠(yuǎn)！

第二，你也可以直接無(wú)視第一條 直接使用瀏覽器中的hack來(lái)控制手機(jī)端和PC端分別使用 zepto和jquery 至于zepto和jquery的使用方法 他們可以說(shuō)基本一樣，會(huì)用jquery 一定就會(huì)用zepto的 只是jquery很多方法并沒(méi)有在zepto中實(shí)現(xiàn)

jquery mobile的主要應(yīng)用場(chǎng)景在哪

jquery mobile主要是應(yīng)用在移動(dòng)端網(wǎng)頁(yè)開(kāi)發(fā)。

jQuery Mobile是jQuery 在手機(jī)上和平板設(shè)備上的版本。jQuery Mobile 不僅會(huì)給主流移動(dòng)平臺(tái)帶來(lái)jQuery核心庫(kù)，而且會(huì)發(fā)布一個(gè)完整統(tǒng)一的jQuery移動(dòng)UI框架。支持全球主流的移動(dòng)平臺(tái)。

JQM 的使命是向所有主流移動(dòng)瀏覽器提供一種統(tǒng)一體驗(yàn)，使整個(gè) Internet 上的內(nèi)容更加豐富 — 不管使用哪種查看設(shè)備。

JQM 的目標(biāo)是在一個(gè)統(tǒng)一的 UI 中交付超級(jí) JavaScript 功能，跨最流行的智能手機(jī)和平板電腦設(shè)備工作。與 jQuery 一樣，JQM 是一個(gè)在 Internet 上直接托管、免費(fèi)可用的開(kāi)源代碼基礎(chǔ)。事實(shí)上，當(dāng) JQM 致力于統(tǒng)一和優(yōu)化這個(gè)代碼基時(shí)，jQuery 核心庫(kù)受到了極大關(guān)注。這種關(guān)注充分說(shuō)明，移動(dòng)瀏覽器技術(shù)在極短的時(shí)間內(nèi)取得了多么大的發(fā)展。

jquery 移動(dòng)端怎么綁定事件

和 pc端是一樣的? 不過(guò)移動(dòng)端 有幾個(gè) 特殊的事件

比如touch 事件

touchstart：手指觸摸到屏幕會(huì)觸發(fā)

touchmove：當(dāng)手指在屏幕上移動(dòng)時(shí)，會(huì)觸發(fā)

touchend：當(dāng)手指離開(kāi)屏幕時(shí)，會(huì)觸發(fā)

touchcancel：可由系統(tǒng)進(jìn)行的觸發(fā)，比如手指觸摸屏幕的時(shí)候，突然alert了一下，或者系統(tǒng)中其他打斷了touch的行為，則可以觸發(fā)該事件

tap事件

tap: 手指碰一下屏幕會(huì)觸發(fā)

longTap: 手指長(zhǎng)按屏幕會(huì)觸發(fā)

singleTap:?手指碰一下屏幕會(huì)觸發(fā)

doubleTap:?手指雙擊屏幕會(huì)觸發(fā)

swipe事件

swipe：手指在屏幕上滑動(dòng)時(shí)會(huì)觸發(fā)

swipeLeft：手指在屏幕上向左滑動(dòng)時(shí)會(huì)觸發(fā)

swipeRight：手指在屏幕上向右滑動(dòng)時(shí)會(huì)觸發(fā)

swipeUp：手指在屏幕上向上滑動(dòng)時(shí)會(huì)觸發(fā)

swipeDown：手指在屏幕上向下滑動(dòng)時(shí)會(huì)觸發(fā)

這些事件不能用 $(xx).事件名() 去綁定 應(yīng)該

$(document).bind('touchmove',?function?(event)?{

console.log('手指在屏幕上滑動(dòng)了')

event.preventDefault();

});

解綁?用unbind

怎么使用JQuery Mobile開(kāi)發(fā)移動(dòng)網(wǎng)站

方法/步驟

簡(jiǎn)單的說(shuō)明一下JQueryMobile. 它是一個(gè)很好的跨平臺(tái)的移動(dòng)端網(wǎng)站開(kāi)發(fā)框架。 是一個(gè)前臺(tái)的框架?，F(xiàn)在要使用這個(gè)框架組一個(gè)界面，這個(gè)界面很簡(jiǎn)單， 但是麻雀雖小五臟俱全， 然后模板實(shí)現(xiàn)， 知識(shí)講解完畢。html要使用HTML5的標(biāo)準(zhǔn)來(lái)寫， 因?yàn)镴QueryMobile是基于HTML5的。 書寫html5的格式如圖，

既然使用JQueryMobile就要有這個(gè)框架， 這里可以使用本地引用的方式， 和網(wǎng)上引用， 也叫做cdn引用。就是比較穩(wěn)定和快速的引用外部文件的一種方式。 這里使用cdn的方式， 這樣只要可以上網(wǎng)就可以使用該框架。

在寫移動(dòng)端的網(wǎng)站的時(shí)候， 一定要寫一個(gè)meta的name為viewport的屬性， 因?yàn)樵搶傩源碇W(wǎng)站頁(yè)面的自適應(yīng)。簡(jiǎn)單的寫法為：meta name="viewport" content="width=device-width, initial-scale=1" 代表著網(wǎng)站為驅(qū)動(dòng)設(shè)備的寬度。

然后加入框架之后， 寫一個(gè)簡(jiǎn)單的界面。 這里面JQueryMobile大量的使用了一個(gè)data-的屬性， 這里使用最多的事data-role。 代表著他默認(rèn)的樣式規(guī)則。 就是提前定義好了很多的樣式來(lái)供你使用。 常用的page. 代表著頁(yè)面， listview， 代表著一個(gè)列表視圖。下面是代碼和效果圖

稍微說(shuō)明一下。

data-role="page" 是代表著一個(gè)頁(yè)面可以看做該內(nèi)容下是一個(gè)頁(yè)面顯示的內(nèi)容

data-role=”header"代表著 頁(yè)面的頁(yè)頭， 就是頁(yè)面的最上面顯示的內(nèi)容這里需要注意， 里面要加上子標(biāo)簽內(nèi)容， 要不然， 就不會(huì)居中顯示內(nèi)容了。推薦使用h1.

data-role="footer"代表著頁(yè)腳的內(nèi)容。 也是網(wǎng)站的一個(gè)說(shuō)明信息。 或者是一個(gè)底部導(dǎo)航菜單。 還有一部分， 就是data-role="content" 是代表著頁(yè)面內(nèi)容部分， 主要的內(nèi)容在這里面顯示。

這3個(gè)部分構(gòu)成了一個(gè)簡(jiǎn)單的頁(yè)面。 所以， 現(xiàn)在可以體驗(yàn)到它的強(qiáng)大， 不用寫太多的代碼一個(gè)簡(jiǎn)單的框架就好了， 下面繼續(xù)增加一個(gè)listveiw的列表視圖。

完成列表視圖的代碼， 增加一個(gè)文章列舉表的代碼， 這里列表是使用data-role="listview" 來(lái)修飾樣式。 然后這里只需要加上data-role="listview" 你發(fā)現(xiàn)想要的list效果就實(shí)現(xiàn)了。 這樣我們一個(gè)簡(jiǎn)單的頁(yè)面效果就實(shí)現(xiàn)了。

新聞標(biāo)題：移動(dòng)端jquery,移動(dòng)端什么意思
文章出自：http://m.jiaotiyi.com/article/dscepep.html