easyUI下拉列表点击事件使用方法
2017-05-18 11:58
633 查看
本文实例为大家分享了使用easyUI下拉列表点击事件的方法,供大家参考,具体内容如下
可以通过input 和select来创建下拉列表
其中select的创建如下:
通过json来创建js数组
[{ "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);
页面效果显示:
属性解释:
valueField:'id'---objTCP.id--->选项值value
textField:'text'---objTCP.text--->页面显示值
objTCP.selected=true; --->默认显示
点击修改事件
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 () { })
默认加载后,onSelect事件就可以正常使用了。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- EasyUI中包选择按钮的下拉列表的使用方法
- easyui事件和方法的使用方法
- 使用js写点击一个事件使页面返回顶部以及控制一个元素在右下角的固定位置的方法
- easyui的事件和方法的使用方法
- 安卓实现spinner下拉列表以及实现它点击事件
- javascript事件列表大全解说,点击事件,双击事件,触发事件,键盘事件,鼠标移动事件,javaScript事件使用小全
- JAVA EE 项目经常使用知识 之AJAX技术实现select下拉列表联动的两种使用方法(让你真正理解ajax)
- Android 控件使用Animator动画后,点击事件失效解决方法
- JQuery 使用attr方法实现下拉列表选中
- ListView使用自定义适配器的情况下实现适配器的文本和图标控件点击事件执行Activity界面中的方法
- VC中点击ComboBox下拉列表不显示数据的解决方法
- jquery中交替点击事件toggle方法的使用示例
- 【WPF开发备忘】使用MVVM模式开发中列表控件内的按钮事件无法触发解决方法
- Android下拉列表使用方法
- jquery 动态向下拉列表填充数据,点击下拉列表时传值并触发事件
- 使用grid控件时,含有combo列表框的情况下,无法显示下拉列表,可能的解决方法
- jquery中交替点击事件toggle方法的使用示例
- jquery中交替点击事件toggle方法的使用示例
- ListView使用自定义适配器的情况下实现适配器的控件点击事件执行Activity界面中的方法
- 使用layout方法实现控件的移动并且不影响点击事件