下拉分頁選擇插件 SelectPage v2.4 發(fā)布了,插件更新內(nèi)容:
創(chuàng)新互聯(lián)建站企業(yè)建站,10余年網(wǎng)站建設(shè)經(jīng)驗,專注于網(wǎng)站建設(shè)技術(shù),精于網(wǎng)頁設(shè)計,有多年建站和網(wǎng)站代運營經(jīng)驗,設(shè)計師為客戶打造網(wǎng)絡(luò)企業(yè)風(fēng)格,提供周到的建站售前咨詢和貼心的售后服務(wù)。對于網(wǎng)站建設(shè)、成都網(wǎng)站建設(shè)中不同領(lǐng)域進行深入了解和探索,創(chuàng)新互聯(lián)在網(wǎng)站建設(shè)中充分了解客戶行業(yè)的需求,以靈動的思維在網(wǎng)頁中充分展現(xiàn),通過對客戶行業(yè)精準(zhǔn)市場調(diào)研,為客戶提供的解決方案。
插件簡介:
多功能下拉選擇插件 SelectPage
支持autocomplete、鍵盤操作、分頁、標(biāo)簽多選等多功能的選擇器插件
插件效果
多選模式效果圖:
默認單選模式效果圖:
入門指南、實例、文檔
更多實例、文檔請訪問: https://terryz.github.io
項目GitHub地址: https://github.com/TerryZ/SelectPage
如果您覺得項目還不錯,還請給項目( Github / 碼云 )加個Star,以示支持
什么是SelectPage
功能特點
瀏覽器兼容:IE8+、Chrome、Firefox等
插件基于jQuery開發(fā),可在Bootstrap2、3環(huán)境下使用,亦可在原生無UI框架的環(huán)境下直接使用
為什么要有SelectPage
有時候我們需要有一個插件,它可以輸入關(guān)鍵字進行快速查找,可以下拉進行選擇,可以在展示大量數(shù)據(jù)時進行分頁顯示,可以使用鍵盤進行快速操作,可以適應(yīng)各種UI環(huán)境,可以被靈活定制,而上述的情況就真的出現(xiàn)在現(xiàn)實項目的需求里了
這就是為什么會有SelectPage插件的原因
怎么使用SelectPage
在 Github 或 碼云 上下載最新的版本,解壓后并放入需要使用的項目中
引用文件
< !-- 基礎(chǔ)環(huán)境引用說明 -- > < !-- Bootstrap的UI框架基礎(chǔ)樣式 -- > < link rel="stylesheet" href="bootstrap.min.css" rel="external nofollow" type="text/css"> < !-- 插件使用了部分font-awesome的圖標(biāo),所以需要引入該樣式 -- > < link rel="stylesheet" href="font-awesome.min.css" rel="external nofollow" type="text/css"> < !-- jQuery,Bootstrap的基礎(chǔ)腳本引用 -- > < script type="text/javascript" src="bootstrap.min.js" >< /script > < script type="text/javascript" src="jquery.min.js" >< /script > < !-- 插件使用的樣式表文件,根據(jù)使用環(huán)境的Bootstrap版本進行引用 -- > < !-- Bootstrap2使用 -- > < link rel="stylesheet" href="selectpage.css" rel="external nofollow" type="text/css"> < !-- Bootstrap3使用 -- > < link rel="stylesheet" href="selectpage.bootstrap3.css" rel="external nofollow" type="text/css"> < !-- 非Bootstrap生態(tài)下引用該樣式 -- > < link rel="stylesheet" href="selectpage.base.css" rel="external nofollow" type="text/css"> < !-- 以上的樣式文件根據(jù)實際使用的環(huán)境進行引用,引用其中一項即可 -- > < !-- 插件核心腳本 -- > < script type="text/javascript" src="selectpage.js" >< /script > HTML頁面元素設(shè)置 < !-- 設(shè)置文本框為插件基本元素 -- > < input type="text" id="selectPage" > 腳本初始化插件 //定義數(shù)組,在服務(wù)端返回的數(shù)據(jù)也以該格式返回:Array[{Object},{...}] var tag_data = [ {id:1 ,name:'Chicago Bulls',desc:'芝加哥公牛'}, {id:2 ,name:'Cleveland Cavaliers',desc:'克里夫蘭騎士'}, {id:3 ,name:'Detroit Pistons',desc:'底特律活塞'}, {id:4 ,name:'Indiana Pacers',desc:'印第安納步行者'} ]; //初始化插件 $('#selectPage').selectPage({ showField : 'desc', keyField : 'id', data : tag_data });
總結(jié)
以上所述是小編給大家介紹的SelectPage v2.4 發(fā)布新增純下拉列表和關(guān)閉分頁功能,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對創(chuàng)新互聯(lián)網(wǎng)站的支持!
當(dāng)前題目:SelectPagev2.4發(fā)布新增純下拉列表和關(guān)閉分頁功能
網(wǎng)站網(wǎng)址:http://muchs.cn/article36/ghjosg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站內(nèi)鏈、品牌網(wǎng)站建設(shè)、用戶體驗、網(wǎng)站設(shè)計、網(wǎng)站策劃、品牌網(wǎng)站設(shè)計
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)