Chosen 基于jquery的選擇框插件使用方法
更新時間:2012年05月30日 14:47:06 作者:
Chosen 是一個JavaScript插件,它能讓丑陋的、很長的select選擇框變的更好看、更方便。目前,它支持 jQuery 和 Prototype 兩種JavaScript引擎。
Chosen插件下載地址 http://www.dbjr.com.cn/jiaoben/38027.html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="chosen/chosen.jquery.js" type="text/javascript"></script>
應(yīng)用JS文件
<select class="chzn-select" data-placeholder="Choose a Country" style="width:350px;" tabindex="1">
<option value=""></option>
<option value="United States">United States</option>
<option value="United Kingdom">United Kingdom</option>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
</select>
class設(shè)這為chzn-select
初始化:$(".chzn-select").chosen();
對select進(jìn)行操作時候需注意如下:先刪除外部套用的層在經(jīng)常操作,最后在加上$(".chzn-select").chosen();
var selectObj = $("#slectplat");
selectObj.parent().children().remove('div');
selectObj.removeClass();
$("#slectplat").val(_plat);
selectObj.addClass("chzn-select");
selectObj.chosen();
復(fù)制代碼 代碼如下:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="chosen/chosen.jquery.js" type="text/javascript"></script>
應(yīng)用JS文件
復(fù)制代碼 代碼如下:
<select class="chzn-select" data-placeholder="Choose a Country" style="width:350px;" tabindex="1">
<option value=""></option>
<option value="United States">United States</option>
<option value="United Kingdom">United Kingdom</option>
<option value="Afghanistan">Afghanistan</option>
<option value="Albania">Albania</option>
</select>
class設(shè)這為chzn-select
初始化:$(".chzn-select").chosen();
對select進(jìn)行操作時候需注意如下:先刪除外部套用的層在經(jīng)常操作,最后在加上$(".chzn-select").chosen();
復(fù)制代碼 代碼如下:
var selectObj = $("#slectplat");
selectObj.parent().children().remove('div');
selectObj.removeClass();
$("#slectplat").val(_plat);
selectObj.addClass("chzn-select");
selectObj.chosen();
您可能感興趣的文章:
- jQuery實(shí)現(xiàn)選中彈出窗口選擇框內(nèi)容后賦值給文本框的方法
- 基于JQuery的Select選擇框的華麗變身
- 基于jquery實(shí)現(xiàn)select選擇框內(nèi)容左右移動添加刪除代碼分享
- 基于jQuery下拉選擇框插件支持單選多選功能代碼
- jquery通過select列表選擇框?qū)Ρ砀駭?shù)據(jù)進(jìn)行過濾示例
- jquery實(shí)現(xiàn)select選擇框內(nèi)容左右移動代碼分享
- 各種選擇框jQuery的選中方法(實(shí)例講解)
- Jquery多選下拉列表插件jquery multiselect功能介紹及使用
- 用jquery實(shí)現(xiàn)下拉菜單效果的代碼
- 用jquery實(shí)現(xiàn)的一個超級簡單的下拉菜單
- jQuery模擬12306城市選擇框功能簡單實(shí)現(xiàn)方法示例
相關(guān)文章
jQuery Easyui 驗(yàn)證兩次密碼輸入是否相等
easyui是一種基于jQuery的用戶界面插件集合。接下來通過本文給大家介紹jQuery Easyui 驗(yàn)證兩次密碼輸入是否相等的相關(guān)知識,感興趣的朋友一起學(xué)習(xí)吧2016-05-05基于jquery實(shí)現(xiàn)人物頭像跟隨鼠標(biāo)轉(zhuǎn)動
一款非常乖巧的人物頭像跟隨鼠標(biāo)轉(zhuǎn)動效果,在瀏覽器屏幕內(nèi),人物臉龐始終面向鼠標(biāo)轉(zhuǎn)動,本篇文章給大家介紹基于jquery實(shí)現(xiàn)人物頭像跟隨鼠標(biāo)轉(zhuǎn)動,有需要的朋友可以參考下2015-08-08jQuery EasyUI API 中文文檔 - EasyLoader 加載器
jQuery EasyUI API 中文文檔 - EasyLoader 加載器,使用jQuery EasyUI的朋友可以參考下。2011-09-09jQuery實(shí)現(xiàn)右鍵菜單、遮罩等效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)右鍵菜單、遮罩、彈出層效果,適應(yīng)管理系統(tǒng)界面,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-09-09jQuery去掉字符串起始和結(jié)尾的空格(多種方法實(shí)現(xiàn))
去掉字符串起始和結(jié)尾的空格在實(shí)際應(yīng)用中時很常見的的功能,本教程以多種方法為大家介紹下去掉空格的方法,感興趣的朋友可以參考下哈2013-04-04Asp.net下使用Jquery Ajax傳送和接收DataTable的代碼
對于習(xí)慣使用GridView的人來說,前臺頁面需要動態(tài)添加表格的行數(shù),是一件痛苦的事。GridView處理這種事情相當(dāng)麻煩,你點(diǎn)擊“新增一行”,需要回傳到服務(wù)器。2010-09-09