SelectPagev2.4發(fā)布新增純下拉列表和關(guān)閉分頁功能-創(chuàng)新互聯(lián)

下拉分頁選擇插件 SelectPage v2.4 發(fā)布了,插件更新內(nèi)容:

成都創(chuàng)新互聯(lián)主營廉江網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,重慶App定制開發(fā),廉江h(huán)5小程序制作搭建,廉江網(wǎng)站營銷推廣歡迎廉江等地區(qū)企業(yè)咨詢
  • 增加pagination參數(shù),指定稿件是否使用分頁加載數(shù)據(jù),以及顯示分頁欄
  • 增加listSize參數(shù),指定了不使用分頁的列表,顯示的高度,單位為個(gè)(選項(xiàng)個(gè)數(shù)),默認(rèn)顯示10個(gè)項(xiàng)目的高度
  • 設(shè)置selectOnly:true的情況下,輸入框?yàn)橹蛔x模式,不允許輸入查詢過濾
  • 修復(fù)多選模式下及設(shè)置了大選中項(xiàng)目時(shí),選中了項(xiàng)目再次點(diǎn)擊“全選本頁”按鈕會(huì)在已選擇的基礎(chǔ)上增加大選中項(xiàng)目個(gè)數(shù)的項(xiàng)目
  • 調(diào)整下拉列表樣式及位置
  • 增加單選模式下,選中項(xiàng)目后,自動(dòng)顯示清空按鈕
  • 修復(fù)多選模式下,移除本頁和清除所有兩個(gè)按鈕點(diǎn)擊后,回調(diào)出錯(cuò)的問題
  • 增加搜索無結(jié)果時(shí)顯示提示信息

插件簡(jiǎn)介:

多功能下拉選擇插件 SelectPage

支持autocomplete、鍵盤操作、分頁、標(biāo)簽多選等多功能的選擇器插件

插件效果

多選模式效果圖:

SelectPage v2.4 發(fā)布新增純下拉列表和關(guān)閉分頁功能

默認(rèn)單選模式效果圖:

SelectPage v2.4 發(fā)布新增純下拉列表和關(guān)閉分頁功能

入門指南、實(shí)例、文檔

更多實(shí)例、文檔請(qǐng)?jiān)L問: https://terryz.github.io

項(xiàng)目GitHub地址: https://github.com/TerryZ/SelectPage

如果您覺得項(xiàng)目還不錯(cuò),還請(qǐng)給項(xiàng)目( Github /  碼云 )加個(gè)Star,以示支持

什么是SelectPage

功能特點(diǎn)

  • 基于jQuery、Bootstrap2、3開發(fā)
  • 也可應(yīng)用于無任何UI框架的原生HTML環(huán)境
  • 輸入框輸入關(guān)鍵字快速查找(autocomplete)
  • 結(jié)果列表分頁展示
  • 使用鍵盤快速操作基本功能及分頁功能
  • 允許使用靜態(tài)json數(shù)據(jù)源或ajax動(dòng)態(tài)請(qǐng)求的數(shù)據(jù)源
  • 多項(xiàng)選擇以標(biāo)簽(Tag)形式展現(xiàn)
  • 結(jié)果列表自動(dòng)判斷屏幕邊緣,避免內(nèi)容超出可視范圍
  • 豐富的參數(shù)設(shè)置及功能API調(diào)用

瀏覽器兼容:IE8+、Chrome、Firefox等

插件基于jQuery開發(fā),可在Bootstrap2、3環(huán)境下使用,亦可在原生無UI框架的環(huán)境下直接使用

為什么要有SelectPage

有時(shí)候我們需要有一個(gè)插件,它可以輸入關(guān)鍵字進(jìn)行快速查找,可以下拉進(jìn)行選擇,可以在展示大量數(shù)據(jù)時(shí)進(jìn)行分頁顯示,可以使用鍵盤進(jìn)行快速操作,可以適應(yīng)各種UI環(huán)境,可以被靈活定制,而上述的情況就真的出現(xiàn)在現(xiàn)實(shí)項(xiàng)目的需求里了

這就是為什么會(huì)有SelectPage插件的原因

怎么使用SelectPage

在 Github 或  碼云 上下載最新的版本,解壓后并放入需要使用的項(xiàng)目中

引用文件

< !-- 基礎(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版本進(jìn)行引用 -- >
< !-- 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ù)實(shí)際使用的環(huán)境進(jìn)行引用,引用其中一項(xiàng)即可 -- >
< !-- 插件核心腳本 -- >
< script type="text/javascript" src="selectpage.js" >< /script >
HTML頁面元素設(shè)置
< !-- 設(shè)置文本框?yàn)椴寮驹?-- >
< 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
});

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

標(biāo)題名稱:SelectPagev2.4發(fā)布新增純下拉列表和關(guān)閉分頁功能-創(chuàng)新互聯(lián)
網(wǎng)頁鏈接:http://muchs.cn/article12/phidc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供動(dòng)態(tài)網(wǎng)站、全網(wǎng)營銷推廣網(wǎng)站建設(shè)、網(wǎng)站收錄、品牌網(wǎng)站設(shè)計(jì)網(wǎng)站導(dǎo)航

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

成都做網(wǎng)站