效果图:

1.html

<input id="alarmLeve" class="easyui-combobox" name="alarmLeve" style="width:100px;display:inline-block;margin-right:20px;"/>

2.js

//初始化
$('#alarmLeve').combobox( {
multiple: true,
panelHeight: 'auto',//自适应
valueField: 'id',//绑定字段ID
textField: 'text',//绑定字段Name
onLoadSuccess:function(){
$(".combo").click(function(){
$(this).prev().combobox("showPanel");
});
},
data:[{
"id":1,
"text":"1"
},{
"id":2,
"text":"2"
},{
"id":3,
"text":"3"
},{
"id":4,
"text":"4"
}],
formatter: function (row) {
var opts = $(this).combobox('options');
return '<input type="checkbox" class="combobox-checkbox" style="margin:0 5px;vertical-align: -2px" id="' + row[opts.valueField] + '">' + row[opts.textField]
},
//获取数据URL
//选择树节点触发事件
onSelect: function (row) {
var opts = $(this).combobox('options');
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', true);
},
onUnselect: function (row) {
var opts = $(this).combobox('options');
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', false);
}
})

3.获取值

$('#comboboxlist').combobox('getValue');  //单选时
$('#comboboxlist').combobox('getValues'); //多选时

示例:

4.得到input的字符串

var l = $('#alarmLeve').combobox('getText');  //得到字符串

效果图:

  

使用easyui combobox初始化+在input中触发下拉框+获取值的更多相关文章

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

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

  2. angular 中自己常用的下拉框获取值方法

    方法一 HTML页中 <select name="" id="if02" data-first-option="true" (chan ...

  3. 选择屏幕中的下拉框和dialog中下拉框设计

    REPORT  YTEST014. PARAMETERS: auart LIKE vapma-auart  AS LISTBOX   VISIBLE LENGTH 6. AT SELECTION-SC ...

  4. ASP.NET MVC中的cshtml页面中的下拉框的使用

    ASP.NET MVC中的cshtml页面中的下拉框的使用 用上@Html.DropDownList 先记下来..以做备忘...

  5. easyui datagrid combobox下拉框获取数据问题

    最近在使用easyui的datagrid,在可编辑表格中添加一个下拉框,查了下API,可以设置type : 'combobox',来做下拉框,这下拉框是有了,可是这后台数据怎么传过来呢,通过查API可 ...

  6. LayUI中select下拉框选中触发事件

    代码: var form = layui.form, layer = layui.layer; // 监听 $(document).ready(function() { // select下拉框选中触 ...

  7. easyui源码翻译1.32--Combo(自定义下拉框)

    前言 扩展自$.fn.validatebox.defaults.使用$.fn.combo.defaults重写默认值对象.下载该插件翻译源码 自定义下拉框显示一个可编辑的文本框和下拉面板在html页面 ...

  8. easyui form load 数据表单有下拉框

    (function () { $('#text1').combobox({ url: 'http://localhost:5463/test/getComboJson' }) $('#text2'). ...

  9. android中自定义下拉框(转)

    android自带的下拉框好用不?我觉得有时候好用,有时候难有,项目规定这样的效果,自带的控件实现不了,那么只有我们自己来老老实实滴写一个新的了,其实最基本的下拉框就像一些资料填写时,点击的时候出现在 ...

随机推荐

  1. centos7编译安装mysql5.6

    先安装如下依赖包: $ yum -y install make gcc-c++ cmake bison-devel  ncurses-devel 下载MySQL5.6.14安装包,https://pa ...

  2. F5 datasheet

  3. GDI 直线和折线(6)

    设置开始点 MoveToEx 函数用于移动画笔到指定的位置: BOOL MoveToEx( HDC hdc, // 设备环境句柄 int X, // 要移动到的 x 坐标 int Y, // 要移动到 ...

  4. Tab切换效果(修改)

    前几天我写了这个切换效果,但是是只传一个值的函数,经过各位大牛的指点发现还是有些问题的,于是经过我不懈的努力,完善了代码: 传递多个参数替代函数里面包含事件这个问题: html代码: <div ...

  5. mongodb 和 mongoose 初探

    mongodb MongoDB 是一个介于关系数据库和非关系数据库之间的产品,是非关系数据库当中功能最丰富,最像关系数据库的. 1. 安装相关 1.1 下载 官网下载地址 :官网下载社区版 1.2 安 ...

  6. JavaScript:进制转换。

    最近做了一些进制的转换的点. 十进制转二进制: let a = 45; a.toString(2); //"101101" let b = 123; b.toString(2); ...

  7. php 常用header

    //定义编码 header( 'Content-Type:text/html;charset=utf-8 '); //Atom header('Content-type: application/at ...

  8. Nginx 的安装 与 启动

    没有图文说明,是我看着视频一步一步照做的,安装过程了,也随便把步骤记录下来了. 我是新装 Linux 服务器,所以安装过程中出现的错误也是第一遇到,希望对你们有所帮助. 也是方便自己以后再次安装 ni ...

  9. OOP 面向对象 七大原则 (二)

    OOP 面向对象   七大原则 (二) 上一篇写到了前四个原则,这一篇继续~~ 接口隔离:客户端不应该依赖它不需要的接口:一个类对另一个类的依赖应该建立在最小的接口上. 又是一句大白话~就是说接口尽量 ...

  10. 【Codeforces Round #493 (Div. 2) B】Cutting

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 显然只有在前i个位置奇数偶数出现次数都相同的地方才能切. (且不管前面怎么切,这里都能切的. 那么就相当于有n个物品,每个物品的代价 ...