easyui-combobox與input組合下拉框，事件以及獲取值
話不多說上代碼：
這是一個簡單的前臺利用easyui-combobox 和input 組成的下拉框
<label class="layui-form-label"><font color="red">*</font>是否預警:</label>
<div class="layui-input-inline">
<input style="width:100%" class="easyui-combobox" name="blIsWarn" id="blIsWarn" editable="false" lay-verify="required" data-options="valueField:'value',required:true,textField: 'label',panelHeight:'auto',
data: [{
label: '否',
value: 'false'
},{
label: '是',
value: 'true'
}]"></input>
</div>
如圖：
需求：監聽下拉框選中的值，來 顯示/隱藏 開始預警時間。
在網上找了許多方法，大多是easyui-combobox與select 組合成的下拉框
類似這種：
<select id="cc" class="easyui-combobox" name="dept" style="width:200px;">
<option value="aa">aitem1</option>
<option>bitem2</option>
<option>bitem3</option>
<option>ditem4</option>
<option>eitem5</option>
</select>
而他的取值和選擇觸發監聽事件是這樣：
//多選取值
$('#cc').combobox('getValues');
//單選取值
$('#cc').combobox('getValue');
//選擇監聽事件
$("#cc").combobox({
onSelect: function () {
}
})；
當easyui-combobox與input組合框使用這種方式取值的時候一直是空格,並且onSelect 監聽事件無效！
在研究了一個多小時後，終於找到了這個方法：
<input style="width:100%" class="easyui-combobox" name="blIsWarn" id="blIsWarn" editable="false" lay-verify="required" data-options="valueField:'value',required:true,textField: 'label',panelHeight:'auto',
data: [{
label: '否',
value: 'false'
},{
label: '是',
value: 'true'
}],onSelect:function(){
changeScenes();
}"></input>
在options後加上onSelect 選中事件，寫好方法名，在js文件中再寫好要用方法。
在測試了一番後顯示可用！
JS文件代碼：
function changeScenes() {
conlse.log("我被選中了")；
}
選中以後就是取值的問題。之前百度以及官網提供的代碼完全獲取不到！
在後來看到一段大神的代碼，受到啓發：
$(function () {
$('#Select6').combobox({
onSelect: function (record) {
var jsonMap = { "year": record.pkey };
$.ajax({
url: "getYearHandler.ashx?action=getdata",
type: "post",
data: jsonMap,
datatype: "json",
success: function (data) {
var obj = eval('(' + data + ')');
dosomething(obj);
}
});
}
});
});
看着一段： onSelect: function (record) 傳入的參數record是什麼？？
再看這一段：var jsonMap = { “year”: record.pkey } record.pkey？？
原來 傳入的record參數就是你下拉框中的所有值！record.pkey就是你選中的值。結合我們的代碼是這樣（我只截取到了方法那段）：
onSelect:function(data){
changeScenes(data.value);
}
都是data.value嗎？並不是，data後面是你在data中設置的名稱：而我的data.value就是我要用於判斷的值！
data: [{
label: '否',
value: 'false'
},{
label: '是',
value: 'true'
}]
到了js文件就好寫了，直接傳過來的參數就是你選中的值!可以直接判斷。字符串判斷
/**
* 監聽事件
*/
function changeScenes(data) {
if(data == "true"){
$("#warnTimeDiv").css("display","block");
}else {
$("#warnTimeDiv").css("display","none");
}
}
至此功能實現!