可以通过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. 杭电 2553 N皇后问题 (dfs)

    Description 在N*N的方格棋盘放置了N个皇后,使得它们不相互攻击(即任意2个皇后不允许处在同一排,同一列,也不允许处在与棋盘边框成45角的斜线上. 你的任务是,对于给定的N,求出有多少种合 ...

  2. Python数据结构--双向链表

    ''' 双向链表包含第一个和最后一个的链接元素. 每个链接都有一个数据字段和两个称为next和prev的链接字段. 每个链接都使用其下一个链接与其下一个链接链接. 每个链接都使用其上一个链接与之前的链 ...

  3. 大数据学习——hive数据类型

    1. hive的数据类型Hive的内置数据类型可以分为两大类:(1).基础数据类型:(2).复杂数据类型2. hive基本数据类型基础数据类型包括:TINYINT,SMALLINT,INT,BIGIN ...

  4. zoj 2947 Abbreviation

    Abbreviation Time Limit: 2 Seconds      Memory Limit: 65536 KB When a Little White meets another Lit ...

  5. F题

    Problem F Codeforces 16E 这道题是一道数位Dp将鱼的死活列为0两种状态然后找DP关系 •题意:有n(n<=18)条鱼,接下来的n-1天,每天会有一对鱼(a,b)相遇,每天 ...

  6. ubuntu使用git提交github时,执行pull或者push命令要重新输入用户名和密码

    ubuntu使用git提交github时,执行pull或者push命令要重新输入用户名和密码: 1:问题现象: hlp@hlp:~/code/github_code/catch_imooc1$ git ...

  7. middle(bzoj 2653)

    Description 一个长度为n的序列a,设其排过序之后为b,其中位数定义为b[n/2],其中a,b从0开始标号,除法取下整. 给你一个长度为n的序列s. 回答Q个这样的询问:s的左端点在[a,b ...

  8. 出现 Assigning the return value of new by reference is deprecated in xxxx &&“Warning: Call-time pass-by-reference has been deprecated”怎么办?

    自从php5.3,越来越多的人会遇到“Assigning the return value of new by reference is deprecated in xxxx”这样的提示,尤其是在国外 ...

  9. Codechef-ANCESTOR(树套树/CDQ分治)

    题意: 给定两棵有根树,各有 N 个点.两棵树上的点分别被从 1 到 N 标号.两棵树的根均为标号为 1 的节点. 你的任务非常简单:对于每个 i,找到一个 j(j != i),使得在两棵树中 j 都 ...

  10. JavaScript高级程序设计重点(一)

    1.一个完整的 JavaScript 实现应该由下列三 个不同的部分组成  核心(ECMAScript)  文档对象模型(DOM)  浏览器对象模型(BOM) 2.Undefined 类型只有一 ...