可以通过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下拉列表点击事件的使用的更多相关文章

  1. 【easyUI】取消easyui行点击选中事件,智能通过勾选checkbox才能选中行

    背景:项目中使用easyui作为前端架子.datagrid默认是点击行就选中此行然后变色. 需求:点击行不让此行选中:只能通过点击复选框才能选中某一行. 解决思路: 1.写点击行函数function ...

  2. EasyUI 中easyui-textbox和easyui-searchbox文本框的点击事件。

    html: <input id="txtsearch" class="easyui-textbox" data-options="buttonT ...

  3. easyui combobox点击输入框弹出下拉框

    由于easyui combobox需要点击下拉箭头才能下拉,不能像select标签那样点击输入框就下拉,所以觉得不太方便,查看了一下,combobox弹出框是一个div,原本想在他的输入框的点击事件中 ...

  4. Axure下拉列表的交互事件 + 自定义元件库

    下拉列表的交互事件: 场景:当点击第一个下拉列表框的江苏时,第二个列表框会显示江苏省的城市:当点击第一个下拉列表框的北京时,第二个列表框会显示北京市的区 操作:把第二个列表框设置为动态面板,设置为两种 ...

  5. EasyUI datagrid 双击行事件

    1.EasyUI 实现点击行的任何位置,触发事件 onLoadSuccess:function(data){ } , pagination : false, //双击事件 onDblClickRow: ...

  6. jquery click()方法模拟点击事件对a标签不生效

    if(e.keyCode == 13) { $items.eq(index).click(); return; } 搜索框下拉列表模拟点击时间,使用上述代码不能触发链接跳转 1,页面使用了bootst ...

  7. Jquery的点击事件,三句代码完成全选事件

    先来看一下Js和Jquery的点击事件 举两个简单的例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

  8. Android笔记——Button点击事件几种写法

    Button点击事件:大概可以分为以下几种: 匿名内部类 定义内部类,实现OnClickListener接口 定义的构造方法 用Activity实现OnClickListener接口 指定Button ...

  9. 关于Android避免按钮重复点击事件

    最近测试人员测试我们的APP的时候,喜欢快速点击某个按钮,出现一个页面出现多次,测试人员能不能禁止这样.我自己点击了几下,确实存在这个问题,也感觉用户体验不太好.于是乎后来我搜了下加一个方法放在我们U ...

随机推荐

  1. DEV Express中ImageCollection的使用

    1,        ImageCollection作为窗体组件的一种,位于Components分类下,拖进窗体以后,显示在界面的底部. 2,        注意ImageCollection的Imag ...

  2. python 数据库操作产生中文乱码的解决办法

    1.执行python mysql数据库查询操作时,产生中文乱码 #!/usr/bin/python # -*- coding: UTF-8 -*- import MySQLdb db = MySQLd ...

  3. PS学习笔记(04)

    Photoshop滤镜的安装 Photoshop滤镜的默认格式为.8bf(也有些滤镜为exe格式的可执行文件),如果你下载的是压缩包,请解压之后再安装. 方法一: 如果你下载的滤镜为exe的可执行文件 ...

  4. luogu3380 【模板】二逼平衡树(树套树)

    #include <iostream> #include <cstdlib> #include <cstdio> #include <ctime> us ...

  5. oracle如何向空表中添加一个类型为clob的非空列

    一般的添加非空列的步骤是:先add可以为空的列,然后update该列为一个值(比如0),最后modify该列的类型 但是遇到类型为clob的就不行了.在modify这步时报错:ORA-22296:in ...

  6. [codeforces538D]Weird Chess

    [codeforces538D]Weird Chess 试题描述 Igor has been into chess for a long time and now he is sick of the ...

  7. 洛谷P1077 摆花

    题目描述 小明的花店新开张,为了吸引顾客,他想在花店的门口摆上一排花,共m盆.通过调查顾客的喜好,小明列出了顾客最喜欢的n种花,从1到n标号.为了在门口展出更多种花,规定第i种花不能超过ai盆,摆花时 ...

  8. 624. Maximum Distance in Arrays

    Problem statement Given m arrays, and each array is sorted in ascending order. Now you can pick up t ...

  9. 转载:K-means聚类算法

    转载地址:http://www.cnblogs.com/jerrylead/archive/2011/04/06/2006910.html K-means也是聚类算法中最简单的一种了,但是里面包含的思 ...

  10. react.js 给标识ref,获取内容

    import React,{Component} from 'react' import ReactDOM from 'react-dom' class App extends Component{ ...