easyUI下拉列表點(diǎn)擊事件使用方法
本文實(shí)例為大家分享了使用easyUI下拉列表點(diǎn)擊事件的方法,供大家參考,具體內(nèi)容如下
可以通過(guò)input 和select來(lái)創(chuàng)建下拉列表
其中select的創(chuàng)建如下:
通過(guò)json來(lái)創(chuàng)建js數(shù)組
[{
"id":1,
"text":"text1"
},{
"id":2,
"text":"text2"
},{
"id":3,
"text":"text3",
"selected":true
},{
"id":4,
"text":"text4"
},{
"id":5,
"text":"text5"
}]
例子:
html代碼片段:
<select id="in_edit_netlink" style="width:160px;" class="easyui-combobox" data-options="valueField:'id',textField:'text',editable:false" > </select>
js代碼片段:
var ljfsArray = new Array();
var objHTTP = new Object();
objHTTP.text = "HTTP";
var objTCP = new Object();
objTCP.text = "TCP";
objTCP.id = 1;
objHTTP.id = 2;
if (data.ljfs == "HTTP") {
objHTTP.selected=true;
} else {
objTCP.selected=true;
}
ljfsArray.push(objHTTP);
ljfsArray.push(objTCP);
$('#in_edit_netlink').combobox('loadData', ljfsArray);
頁(yè)面效果顯示:

屬性解釋?zhuān)?/p>
valueField:'id'---objTCP.id--->選項(xiàng)值value
textField:'text'---objTCP.text--->頁(yè)面顯示值
objTCP.selected=true; --->默認(rèn)顯示
點(diǎn)擊修改事件
onSelect 等同于 onChange
但是麻煩的是:easyUI中不支持onChange,在html中不支持onSelect。
onSelect必須在js代碼中使用:
$("#in_edit_netlink").combobox({
onSelect: function () {
connectionType = $('#in_edit_netlink').val();
if (connectionType == 1) {
$('#in_edit_sjjh').textbox('setValue', tcpIp);
} else {
$('#in_edit_sjjh').textbox('setValue', httpIp);
}
}
})
使用
$(function () {
})
默認(rèn)加載后,onSelect事件就可以正常使用了。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- jQuery使用EasyUi實(shí)現(xiàn)三級(jí)聯(lián)動(dòng)下拉框效果
- EasyUI學(xué)習(xí)之Combobox下拉列表(1)
- EasyUI學(xué)習(xí)之Combobox級(jí)聯(lián)下拉列表(2)
- Jquery Easyui自定義下拉框組件使用詳解(21)
- jQuery Easyui 下拉樹(shù)組件combotree
- jQuery+easyui中的combobox實(shí)現(xiàn)下拉框特效
- jQuery Easyui DataGrid點(diǎn)擊某個(gè)單元格即進(jìn)入編輯狀態(tài)焦點(diǎn)移開(kāi)后保存數(shù)據(jù)
- jQuery EasyUI學(xué)習(xí)教程之datagrid點(diǎn)擊列表頭排序
- EasyUI,點(diǎn)擊開(kāi)啟編輯框,并且編輯框獲得焦點(diǎn)的方法
相關(guān)文章
IE10中flexigrid無(wú)法顯示數(shù)據(jù)的解決方法
這篇文章主要介紹了IE10中flexigrid無(wú)法顯示數(shù)據(jù)的解決方法的相關(guān)資料,需要的朋友可以參考下2015-07-07
jQuery實(shí)現(xiàn)表格元素動(dòng)態(tài)創(chuàng)建功能
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)表格元素動(dòng)態(tài)創(chuàng)建功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-01-01
jquery對(duì)Json的各種遍歷方法總結(jié)(必看篇)
下面就為大家?guī)?lái)一篇jquery對(duì)Json的各種遍歷方法總結(jié)(必看篇)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-09-09
當(dāng)jquery ajax遇上401請(qǐng)求的解決方法
下面小編就為大家?guī)?lái)一篇當(dāng)jquery ajax遇上401請(qǐng)求的解決方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
jQuery創(chuàng)建平滑的頁(yè)面滾動(dòng)(頂部或底部)
如何創(chuàng)建一個(gè)平滑的滾動(dòng)效果是本文的目的使用jQuery讓您可以滾動(dòng)到你的網(wǎng)頁(yè)的頂部或底部,相當(dāng)不錯(cuò)的一個(gè)效果,感興趣的你可不要錯(cuò)過(guò)了哈2013-02-02
基于JQuery的動(dòng)態(tài)刪除Table表格的行和列的代碼
基于JQuery的動(dòng)態(tài)刪除Table表格的行和列的代碼以前腳本之家也發(fā)布過(guò)相關(guān)的代碼,大家可以參考下。2011-05-05
jquery 學(xué)習(xí)之二 屬性(類(lèi))
jquery 學(xué)習(xí)之二 屬性(類(lèi)),需要的朋友可以參考下。2010-11-11
IE中jquery.form中ajax提交沒(méi)反應(yīng)解決方法分享
用jquery form插件,進(jìn)行ajax提交,本來(lái)可以用,好好地,突然發(fā)現(xiàn),firefox,opera等可以提交,ie的success函數(shù)運(yùn)行了2012-09-09
jQuery實(shí)現(xiàn)的Div窗口震動(dòng)特效
這篇文章主要介紹了jQuery實(shí)現(xiàn)的Div窗口震動(dòng)特效 ,需要的朋友可以參考下2014-06-06

