极乐门资源网 Design By www.ioogu.com

本文实例为大家分享了Jquery Easyui自定义下拉框组件的实现代码,供大家参考,具体内容如下

加载方式

JS调用加载

自定义下拉框不能通过标签的方式进行创建。

 <input id="box" />

 <script>
  $(function () {
   //JS 加载调用
   $('#box').combo({
    required : true,
    multiple : true,
   });
  });
</script>

属性列表

Jquery Easyui自定义下拉框组件使用详解(21)

<script>
  $('#box').combo({
   width : 300,
   height : 50,
   panelWidth : 300,
   panelHeight : 200,
   disabled : false,
   hasDownArrow : false,
   delay : 50,
   editable : true,
   readonly : false,
   required : true,
   multiple : true,
  });
 </script>

事件列表

Jquery Easyui自定义下拉框组件使用详解(21)

 <script>
  $('#box').combo({
   required : true,
   multiple : true,
   onShowPanel : function () {
    alert('下拉的时候触发!');
   },
   onHidePanel : function () {
    alert('下拉面板隐藏的时候触发!');
   },
   onChange : function () {
    alert('字段值改变的时候触发!');
   },
  });
 </script>

方法列表

Jquery Easyui自定义下拉框组件使用详解(21)

//返回属性对象
  console.log($('#box').combo('options'));
  //返回下拉面板对象
  console.log($('#box').combo('panel'));
  //返回文本框对象
  console.log($('#box').combo('textbox'));
  //销毁组件
  $('#box').combo('destroy');
  //禁用和启用
  $('#box').combo('disable');
  $('#box').combo('enable');
  //调整到默认宽度
  $(document).click(function () {
   $('#box').combo('resize', 'width');
  });
  //显示下拉面板
  $(document).click(function () {
   $('#box').combo('showPanel');
  });
  //隐藏下拉面板
  $('#box').combo('hidePanel');
  //启用禁用,true 可不填,false 则为不启用
  $('#box').combo('readonly',true);
  //验证文本框内的值是否合法
  $(document).click(function () {
   console.log($('#box').combo('isValid'));
  });
  //清空文本框内容
  $(document).dblclick(function () {
   $('#box').combo('clear');
  });
  //重置文本框到初始状态
  $(document).dblclick(function () {
   $('#box').combo('reset');
  });
  //得到文本框字符串
  $(document).click(function () {
   console.log($('#box').combo('getText'));
  });
  //设置文本框字符串
  $(document).click(function () {
   console.log($('#box').combo('getText'));
  });
  //获取组件的 Value 值
  $(document).click(function () {
   console.log($('#box').combo('getValue'));
   console.log($('#box').combo('getValues'));
  });
  //可以使用$.fn.combo.defaults 重写默认值对象。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

标签:
Jquery,Easyui,下拉框组件

极乐门资源网 Design By www.ioogu.com
极乐门资源网 免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
极乐门资源网 Design By www.ioogu.com

评论“Jquery Easyui自定义下拉框组件使用详解(21)”

暂无Jquery Easyui自定义下拉框组件使用详解(21)的评论...

稳了!魔兽国服回归的3条重磅消息!官宣时间再确认!

昨天有一位朋友在大神群里分享,自己亚服账号被封号之后居然弹出了国服的封号信息对话框。

这里面让他访问的是一个国服的战网网址,com.cn和后面的zh都非常明白地表明这就是国服战网。

而他在复制这个网址并且进行登录之后,确实是网易的网址,也就是我们熟悉的停服之后国服发布的暴雪游戏产品运营到期开放退款的说明。这是一件比较奇怪的事情,因为以前都没有出现这样的情况,现在突然提示跳转到国服战网的网址,是不是说明了简体中文客户端已经开始进行更新了呢?