成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

jQuery (二)

asoren / 1132人閱讀

摘要：文件命名需要使用的庫該庫已經(jīng)兩年未更新了，不過依舊在回復(fù)中，對于庫的檢查，已經(jīng)完全測試通過一個(gè)栗子，日期選擇將為中的元素統(tǒng)統(tǒng)替換為日期選擇組件

使用jQuery處理事件 事件處理

一個(gè)栗子，單擊p時(shí)背景變成灰色

由于es6的箭頭函數(shù)不支持this的綁定，所以無法使用箭頭函數(shù)，只能使用匿名函數(shù)

html




    
    


    
hello world

js

// 單擊任意p時(shí)，使其背景變成灰色
$("p").click(function () { $(this).css("background-color", "gray"); });

效果

或者使用第二個(gè)參數(shù)，添加相關(guān)的屬性，完成事件的相關(guān)觸發(fā)

// 單擊任意p時(shí)，使其背景變成灰色
$(""));
        });
        // 返回這個(gè)未加修改過的jQuery對象，方便鏈?zhǔn)秸{(diào)用
        return this;
    }
ps 這個(gè)灰常簡單，原型鏈那一套內(nèi)容，需要注意的是要進(jìn)行返回該對象，否則無法進(jìn)行鏈?zhǔn)秸{(diào)用

使用一下下

$("#debug").println("x =", "x", "y");

即完成了一個(gè)jquery的插件的封裝
使用jQuery.fx.speeds完成對緩動(dòng)函數(shù)的封裝
擴(kuò)展css選擇，使用jQuery.expr[";"]完成對css選擇的封裝

jQuery.expr[":"].draggable = function(e) {
    return e.draggable === true;
}

使用

$("img:draggable");

等價(jià)于

$("img[draggable=true]")

上方封裝的一個(gè)選擇器為可拖動(dòng)的元素

當(dāng)draggable為true的時(shí)候，可以對元素進(jìn)行拖動(dòng)，這是h5的內(nèi)容
一些注意事項(xiàng)

不要依賴$
插件要返回this
插件有兩個(gè)或者兩個(gè)以上的選項(xiàng)，使用對象直接傳入
不能污染命名空間，請?jiān)趈query上定義一個(gè)方法即可，如果有多個(gè)方法，請直接使用前綴
如果有事件需要綁定，使用插件名作為命名空間，然后放在插件名中，即，不能使用全局的
如果插件需要使用data()方法關(guān)聯(lián)數(shù)據(jù) 數(shù)據(jù)值要在一個(gè)對象中。
文件命名需要使用jquery.plugin.js

jQuery的UI庫

https://jqueryui.com/

ps 該庫已經(jīng)兩年未更新了，不過lssues 依舊在回復(fù)中，對于庫的檢查 https://travis-ci.org/jquery/...，已經(jīng)完全測試通過

一個(gè)栗子，日期選擇

$("input.date").datepicker();

將class為data中的input元素統(tǒng)統(tǒng)替換為日期選擇組件

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/97002.html

相關(guān)文章

  • 細(xì)說 jQuery 事件篇（二） - 處理簡單事件

    摘要：我們可以利用可以對用戶發(fā)起的事件進(jìn)行處理，這里以樣式轉(zhuǎn)換為例來說明。其他類似的操作事件都可以通過這個(gè)方法，將處理事件的程序綁定到同名事件上面。 我們可以利用 jQuery 可以對用戶發(fā)起的事件進(jìn)行處理，這里以樣式轉(zhuǎn)換為例來說明。 增添樣式 基于用戶的事件，對特定的 DOM 元素樣式進(jìn)行轉(zhuǎn)換是 jQuery 處理事件中比較常見的情形，舉例說明，當(dāng)用戶點(diǎn)擊輸入框后，會(huì)增添 highli...

    ckllj 評論0 收藏0

  • jQuery基礎(chǔ)（二）DOM篇

    摘要：將匹配元素集合的父級元素刪除，保留自身和兄弟元素，如果存在在原來的位置。方法查找指定元素集合中每一個(gè)元素的同輩元素。每次回調(diào)函數(shù)執(zhí)行時(shí)，會(huì)傳遞當(dāng)前循環(huán)次數(shù)作為參數(shù)從開始計(jì)數(shù)。 DOM節(jié)點(diǎn)的創(chuàng)建 先介紹下需要用到的瀏覽器提供的一些原生的方法（這里不處理低版本的IE兼容問題）創(chuàng)建流程比較簡單，大體如下： 創(chuàng)建節(jié)點(diǎn)(常見的：元素、屬性和文本) 添加節(jié)點(diǎn)的一些屬性 加入到文檔中流程中涉及的一...

    Harpsichord1207 評論0 收藏0

  • JQuery DOM 常用操作匯總

    摘要：通過高度變化來切換所有匹配元素的可見性，并在切換完成后可選地觸發(fā)一個(gè)回調(diào)函數(shù)。請求完成后回調(diào)函數(shù)請求成功或失敗時(shí)均調(diào)用。 一、JQuery對象的基本方法： (1) get(); 取得所有匹配的元素 (2) get(index); 取得其中一個(gè)匹配的元素 $(this).get(0) 等同于 $(this)[0] (3) Number index(jqueryObj); 搜索子對象 (...

    airborne007 評論0 收藏0

  • W3School 教程整理

    摘要：離線版大部分整理自，少部分整理自，由本人整理。感謝站長的無私奉獻(xiàn)。由于本人精力有限，此處的列表不一定能夠及時(shí)更新，最新版本請到本人博客查看。 離線版大部分整理自 w3cschool ，少部分整理自 w3school ，由本人整理。 感謝 w3cschool 站長的無私奉獻(xiàn)。 由于本人精力有限，此處的列表不一定能夠及時(shí)更新，最新版本請到本人博客查看。 AngularJS教程 最后更...

    douzifly 評論0 收藏0

  • W3School 教程整理

    摘要：離線版大部分整理自，少部分整理自，由本人整理。感謝站長的無私奉獻(xiàn)。由于本人精力有限，此處的列表不一定能夠及時(shí)更新，最新版本請到本人博客查看。 離線版大部分整理自 w3cschool ，少部分整理自 w3school ，由本人整理。 感謝 w3cschool 站長的無私奉獻(xiàn)。 由于本人精力有限，此處的列表不一定能夠及時(shí)更新，最新版本請到本人博客查看。 AngularJS教程 最后更...

    CoffeX 評論0 收藏0

  • W3School 教程整理

    摘要：離線版大部分整理自，少部分整理自，由本人整理。感謝站長的無私奉獻(xiàn)。由于本人精力有限，此處的列表不一定能夠及時(shí)更新，最新版本請到本人博客查看。 離線版大部分整理自 w3cschool ，少部分整理自 w3school ，由本人整理。 感謝 w3cschool 站長的無私奉獻(xiàn)。 由于本人精力有限，此處的列表不一定能夠及時(shí)更新，最新版本請到本人博客查看。 AngularJS教程 最后更...

    Dionysus_go 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<