目錄
#1、jQuery表單驗證外掛:Validation
2、jQuery表單外掛:Form
3、動態綁定事件外掛:livequery
4、jQuery UI外掛程式
5、管理Cookie的插件:Cookie
6、模態視窗外掛:SimpleModal
首頁 web前端 前端問答 jquery有哪些第三方插件

jquery有哪些第三方插件

May 23, 2022 pm 06:24 PM
jquery插件

jquery第三方外掛程式:1、Validation,一個表單驗證外掛;2、Form,一個Ajax表單外掛;3、livequery,一個動態綁定事件外掛;4、Cookie,一個管理Cookie的外掛; 5、SimpleModal,模態視窗插件等。

jquery有哪些第三方插件

本教學操作環境:windows7系統、jquery1.10.2版本、Dell G3電腦。

JQuery有著豐富的第三方的插件,例如:樹形選單、日期控制、圖片切換插件、彈出視窗等等基本前台頁面上的元件都有對應插件,並且用JQuery插件做出來的效果很炫,可以依照自己需求去改寫和封裝插件,簡單又實用。

以下介紹常用第三方外掛程式。

jquery常用的第三方外掛程式

#1、jQuery表單驗證外掛:Validation

(1)Validation簡介 

    最常使用JavScript的場合就是表單的驗證,而jQuery作為一個優秀的JavaScript庫,也提供了一個優秀的表單驗證插件-Validation.Validation是歷史最悠久的jQuery插件之一,經過了全球不同項目的驗證,並得到了許多Web開發者的好評。作為標準的驗證方法庫,Validation擁有以下優點:

  • 內建驗證規則:擁有必填、數字、E-Mail、URL和信用卡號碼等19類別內建驗證規則
  • 自訂驗證規則:可以很方便地自訂驗證規則
  • 簡單強大的驗證資訊提示:預設了驗證資訊提示,並提供自訂覆蓋預設提示資訊的功能
  • #即時驗證:可以透過keyup或blur事件觸發驗證,而不只是在表單提交的時候驗證。

(2)外掛程式下載網址:http://bassistance.de/jquery-plugins/jquery-plugin-validation/

jquery有哪些第三方插件


Validation外掛程式的官方API位址為: http://docs.jquery.com/Plugins/Validation

2、jQuery表單外掛:Form

(1)Form外掛程式簡介 

    jQuery Form外掛程式是優秀的Ajax表單插件,可以非常容易地、無侵入地升級HTML表單以支援Ajax。 jQuery有兩個核心方法-ajaxForm()和ajaxSubmit(),它們集合了從控製表單元素到決定如何管理提交程序的功能。另外iain,插件還包含其他的一些方法:formToArray()、formSerialize()、fieldSerialize()、fieldValue()、clearForm()和resetForm()等 

#(2)jQuery Form表單插件下載位址:http://jquery.malsup.com/form/。讀者可以下載插件,並在該網站上查看簡單上手說明、API、實例程式碼等。

3、動態綁定事件外掛:livequery

(1)livequery外掛程式簡介 

    jQuery的事件綁定功能使得jQuery程式碼與HTML程式碼能夠完全分離,如此程式碼的層次關係更加清晰,維護起來也更加簡單​​。然而對於動態載入到頁面的HTML元素,每次都需要重新綁定事件到這些元素上,十分不便。一款新的插件由此產生,即livequery,可以利用它來給對應的DOM元素註冊時間或觸發回調函數函數。不僅目前選擇器所匹配的元素會被綁定事件,而且後來透過JavaScript添加的元素都會被綁定事件。當元素不再和選擇器相符時,livequery會自動取消事件註冊,使得開發者不再需要關注HTML元素的來源,只需要關注如何撰寫其綁定的事件。 

    透過jQuery選擇器選擇一個DOM元素,livequery外掛程式會即時地在整個DOM範圍將其持久化。這意味著無論元素是先前存在的還是後來動態載入的,事件都會被綁定,就像是CSS為元素添加樣式一樣。同時,這款外掛幾乎在沒佔用什麼資源的情況下就做到了這些功能。
(2)jQuery livequery外掛程式的下載位址:http://plugins.jquery.com/livequery/

4、jQuery UI外掛程式

##(1)jQuery UI簡介: 

    jQuery UI源自於一個jQuery外掛程式-Interface。 Interface插件最早版本我1.2,只支援jQuery1.1.2的版本,後來有人對Interface的大部分代表基於jQuery1.2的API進行重構,並統一了API。由於改進重大,因此版本號碼不是1.3而是直接跳到1.5,並且改名為jQuery UI。 

    jQuery UI主要分為3個部分,互動、微件和效果庫

  • 互動。這裡都是一些 與滑鼠 互動相關的內容。包括拖動,放置,縮放,選擇 和排序 等待。微件(Widget)中有部分是基於這些交互組成來製作的。此函式庫需要 一個jQuery UI 核心函式庫-ui.core.js支援
  • 微件。這裡主要是一些介面的擴展。裡邊包括 了手風琴導航,自動完成,取色器,對話框,滑塊,標籤 ,日曆,放大鏡,進度條和微調控制器等待。此函式庫需要 一個jQuery UI 核心函式庫-ui.core.js支援
  • 效果函式庫。此庫用於提供豐富的動畫效果,讓動畫不再局限於animate()方法。效果庫有自己的一套核心即effects.core.js,無需jQuery的核心庫ui.core.js支援

(2)jQuery UI外掛程式的下載位址為:http ://jqueryui.com/download/all/。選擇「jQuery UI 1.6rc2」連結可以直接下載完整套件,包括原始碼,發行版和測試驅動程式等。

(1)Cookie外掛程式簡介 

    Cookie是網站設計者放置在客戶端的小文字檔案。 Cookie能為使用者提供大量的便利,例如購物網站儲存使用者曾經瀏覽過的產品列表,或是入口網站記住使用者喜歡選擇瀏覽哪一類新聞。在使用者運作的情況下,還可以儲存使用者的登陸情況,使得使用者在造訪網站時不必每次都鍵入這些資訊。

    jQuery提供了一個十分簡單的插件來管理網站的Cookie,該插件的名稱也是Cookie. 

(2)jQuery Cookie插件的下載位址:http://plugins.jquery .com/cookie/

6、模態視窗外掛:SimpleModal

(1)SimpleModal外掛程式簡介 

    SimpleModal是一個輕量級的jQuery插件,它為模數態視窗的發展提供了一個強有力的接口,可以把它當作模態視窗的框架。 SimpleModal非常的靈活,可以創造你能夠想像到的任​​何東西i,而且 你還不需要考慮UI開發中的跨瀏覽器相關問題。

(2)SimpleModal外掛的下載位址:http://www.ericmmartin.com/projects/simplemodal/

7、延遲載入圖片外掛:lazyload

延遲載入圖片或符合某些條件才開始載入圖片

下載網址:https://cdn.bootcss.com/jquery_lazyload/1.9.7/jquery.lazyload.min.js

8、fly外掛程式

新增購物車效果、實現拋物線運動

下載網址:https://github.com/amibug/fly

9、qrcode

能夠在客戶端產生矩陣二維碼QRCode 的jquery外掛程式

##下載位址:https://github.com/ lrsjng/jquery-qrcode

10、spinner

可以很方便的實現購物車數量的加減,也支援使用鍵盤上的上下鍵來改變購物車的數量。

下載網址:https://github.com/vsn4ik/jquery.spinner

等等。 。 。

【推薦學習:

jQuery影片教學web前端影片

以上是jquery有哪些第三方插件的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它們
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

什麼是使用效果?您如何使用它執行副作用? 什麼是使用效果?您如何使用它執行副作用? Mar 19, 2025 pm 03:58 PM

本文討論了React中的使用效應,這是一種用於管理副作用的鉤子,例如數據獲取和功能組件中的DOM操縱。它解釋了用法,常見的副作用和清理,以防止記憶洩漏等問題。

反應和解算法如何起作用? 反應和解算法如何起作用? Mar 18, 2025 pm 01:58 PM

本文解釋了React的對帳算法,該算法通過比較虛擬DOM樹有效地更新DOM。它討論了性能優勢,優化技術以及對用戶體驗的影響。

JavaScript中的高階功能是什麼?如何使用它們來編寫更簡潔和可重複使用的代碼? JavaScript中的高階功能是什麼?如何使用它們來編寫更簡潔和可重複使用的代碼? Mar 18, 2025 pm 01:44 PM

JavaScript中的高階功能通過抽象,常見模式和優化技術增強代碼簡潔性,可重複性,模塊化和性能。

咖哩如何在JavaScript中起作用,其好處是什麼? 咖哩如何在JavaScript中起作用,其好處是什麼? Mar 18, 2025 pm 01:45 PM

本文討論了JavaScript中的咖哩,這是一種將多重題材函數轉換為單詞彙函數序列的技術。它探討了咖哩的實施,諸如部分應用和實際用途之類的好處,增強代碼閱讀

什麼是Usecontext?您如何使用它在組件之間共享狀態? 什麼是Usecontext?您如何使用它在組件之間共享狀態? Mar 19, 2025 pm 03:59 PM

本文解釋了React中的UseContext,該文章通過避免道具鑽探簡化了狀態管理。它討論了通過減少的重新租賃者進行集中國家和績效改善之類的好處。

如何使用Connect()將React組件連接到Redux Store? 如何使用Connect()將React組件連接到Redux Store? Mar 21, 2025 pm 06:23 PM

文章討論了使用Connect()將React組件連接到Redux Store,解釋了MapStateToprops,MapDispatchToprops和性能影響。

您如何防止事件處理程序中的默認行為? 您如何防止事件處理程序中的默認行為? Mar 19, 2025 pm 04:10 PM

文章討論了使用DestrestDefault()方法在事件處理程序中預防默認行為,其好處(例如增強的用戶體驗)以及諸如可訪問性問題之類的潛在問題。

受控和不受控制的組件的優點和缺點是什麼? 受控和不受控制的組件的優點和缺點是什麼? Mar 19, 2025 pm 04:16 PM

本文討論了React中受控和不受控制的組件的優勢和缺點,重點是可預測性,性能和用例等方面。它建議在選擇之間選擇因素。

See all articles