combox改進(jìn)版 頁(yè)面原型參考dojo的,比網(wǎng)上jQuery的那些combox功能強(qiáng),代碼更小
更新時(shí)間:2010年04月15日 19:09:22 作者:
對(duì)于combox功能實(shí)現(xiàn)的最小化js代碼,頁(yè)面原型參考dojo的combox模樣,支持鍵盤(pán)動(dòng)作以及自動(dòng)篩選,高亮等
簡(jiǎn)介
對(duì)于combox功能實(shí)現(xiàn)的最小化js代碼,頁(yè)面原型參考dojo的combox模樣,支持鍵盤(pán)動(dòng)作以及自動(dòng)篩選,高亮等
API
初始化方法
編碼方式
var c=new combox(document.getElementById('a'));
或者
var c=new combox(document.getElementById('a'),{ debug:true });
Css申明方式
<select class="combox" debug="true">
只要class中包含了combox即可,class中同時(shí)包含其他樣式也可以。如
<select class="abc combox def">
亦可
配置參數(shù)說(shuō)明
combox支持配置參數(shù)如下
debug: true/false,是否顯示原始的select元素可見(jiàn)
searchMode: 0為模糊不區(qū)分大小寫(xiě),1為前綴搜索不區(qū)分大小寫(xiě)
remoteSourceUrl:遠(yuǎn)程數(shù)據(jù)源url,支持json格式為下
[
{"text":"a","value":"b"}, {"text":"a1","value":"b1"}
]
remoteFilterUrl:篩選時(shí)候讀取的遠(yuǎn)程url,參數(shù)為xxxx?asdasd=~!value!~,~!value!~為宏,在觸發(fā)時(shí)會(huì)被替換為當(dāng)前輸入框的值
allowAnyValue:默認(rèn)為false,不允許combox輸入非options內(nèi)的數(shù)據(jù)
displayValue:combox的顯示值,當(dāng)displayValue在combox的options里面能夠找到與之對(duì)應(yīng)的value時(shí)候,它顯示該option的text,否則他顯示displayValue
pleaseSelect:當(dāng)combox的txtBox值為pleaseSelect的文本時(shí),下拉時(shí)展開(kāi)所有options
mouseDblClick:0為單擊,1為雙擊
舉例:
var c=new combox(document.getElementById('a'),{
allowAnyValue:true,
pleasSelect:'請(qǐng)選擇',
debug:true })
或者
<select class="combox" allowAnyValue="true" pleasSelect="請(qǐng)選擇" debug="true">
亦可
項(xiàng)目的google code地址
http://code.google.com/p/enhancehtml/
效果
演示地址http://demo.jb51.net/js/combox/demo.htm
下載地址http://jb51.net/jiaoben/25840.html
對(duì)于combox功能實(shí)現(xiàn)的最小化js代碼,頁(yè)面原型參考dojo的combox模樣,支持鍵盤(pán)動(dòng)作以及自動(dòng)篩選,高亮等
API
初始化方法
編碼方式
var c=new combox(document.getElementById('a'));
或者
var c=new combox(document.getElementById('a'),{ debug:true });
Css申明方式
<select class="combox" debug="true">
只要class中包含了combox即可,class中同時(shí)包含其他樣式也可以。如
<select class="abc combox def">
亦可
配置參數(shù)說(shuō)明
combox支持配置參數(shù)如下
debug: true/false,是否顯示原始的select元素可見(jiàn)
searchMode: 0為模糊不區(qū)分大小寫(xiě),1為前綴搜索不區(qū)分大小寫(xiě)
remoteSourceUrl:遠(yuǎn)程數(shù)據(jù)源url,支持json格式為下
[
{"text":"a","value":"b"}, {"text":"a1","value":"b1"}
]
remoteFilterUrl:篩選時(shí)候讀取的遠(yuǎn)程url,參數(shù)為xxxx?asdasd=~!value!~,~!value!~為宏,在觸發(fā)時(shí)會(huì)被替換為當(dāng)前輸入框的值
allowAnyValue:默認(rèn)為false,不允許combox輸入非options內(nèi)的數(shù)據(jù)
displayValue:combox的顯示值,當(dāng)displayValue在combox的options里面能夠找到與之對(duì)應(yīng)的value時(shí)候,它顯示該option的text,否則他顯示displayValue
pleaseSelect:當(dāng)combox的txtBox值為pleaseSelect的文本時(shí),下拉時(shí)展開(kāi)所有options
mouseDblClick:0為單擊,1為雙擊
舉例:
var c=new combox(document.getElementById('a'),{
allowAnyValue:true,
pleasSelect:'請(qǐng)選擇',
debug:true })
或者
<select class="combox" allowAnyValue="true" pleasSelect="請(qǐng)選擇" debug="true">
亦可
項(xiàng)目的google code地址
http://code.google.com/p/enhancehtml/
效果
演示地址http://demo.jb51.net/js/combox/demo.htm
下載地址http://jb51.net/jiaoben/25840.html
您可能感興趣的文章:
- jQuery學(xué)習(xí)筆記之jQuery原型屬性和方法
- jQuery中創(chuàng)建實(shí)例與原型繼承揭秘
- jQuery 版元素拖拽原型代碼
- Javascript學(xué)習(xí)筆記之 對(duì)象篇(一) : 對(duì)象的使用和屬性
- jQuery學(xué)習(xí)筆記之 Ajax操作篇(三) - 過(guò)程處理
- jQuery學(xué)習(xí)筆記之 Ajax操作篇(二) - 數(shù)據(jù)傳遞
- jQuery學(xué)習(xí)筆記之 Ajax操作篇(一) - 數(shù)據(jù)加載
- Javascript 學(xué)習(xí)筆記之 對(duì)象篇(二) : 原型對(duì)象
相關(guān)文章
微信小程序使用onreachBottom實(shí)現(xiàn)頁(yè)面觸底加載及分頁(yè)效果
小程序還沒(méi)有使用pc端的那種分頁(yè)格式,下面這篇文章主要給大家介紹了關(guān)于微信小程序使用onreachBottom實(shí)現(xiàn)頁(yè)面觸底加載及分頁(yè)效果的相關(guān)資料,需要的朋友可以參考下2022-10-10
微信小程序 MinUI組件庫(kù)系列之badge徽章組件示例
這篇文章主要介紹了微信小程序 MinUI組件庫(kù)系列之badge徽章組件示例,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-08-08
淺析webpack 如何優(yōu)雅的使用tree-shaking(搖樹(shù)優(yōu)化)
這篇文章主要介紹了webpack 如何使用tree-shaking(搖樹(shù)優(yōu)化),本文介紹了什么是tree-shaking,commonJS 模塊,es6 模塊,怎么使用tree-shaking等,具體操作步驟大家可查看下文的詳細(xì)講解,感興趣的小伙伴們可以參考一下。2017-08-08
uniapp路由uni-simple-router實(shí)例詳解
uni-simple-router專(zhuān)為uniapp打造的路由器,和uniapp深度集成,這篇文章主要給大家介紹了關(guān)于uniapp路由uni-simple-router的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-09-09
JavaScript實(shí)現(xiàn)瀏覽器網(wǎng)頁(yè)自動(dòng)滾動(dòng)并點(diǎn)擊的示例代碼
這篇文章主要介紹了JavaScript實(shí)現(xiàn)瀏覽器網(wǎng)頁(yè)的自動(dòng)滾動(dòng)并點(diǎn)擊的示例代碼,幫助大家更好的理解和學(xué)習(xí)JavaScript的使用,感興趣的朋友可以了解下2020-12-12
javascript 最常用的10個(gè)自定義函數(shù)[推薦]
如果不使用類(lèi)庫(kù)或者沒(méi)有自己的類(lèi)庫(kù),儲(chǔ)備一些常用函數(shù)總是有好處的。2009-12-12

