文档章节

jquery EasyUI中的MenuButton用法

 大东家
发布于 2015/08/27 13:20
字数 316
阅读 45
收藏 0

在jquery EasyUI 的Demo 中 只有MenuButton 的显示DEMO,没有click 事件的相关操作,下面代码可以用js 动态的为menu item 绑定click 事件。

具体操作实现方法:

Html 代码:

<a id="helloEasyUI" style="color:#0094ff"  icon="icon-lightning">批量设置列宽</a>  
<div id="cusmenu" style="width:150px;"> 
    <div id="80">宽度 80px</div> 
    <div id="100">宽度 100px</div> 
    <div id="120">宽度 120px</div> 
    <div class="menu-sep"></div> 
    <div iconCls="icon-set2">自定义列宽</div> 
 </div> 
js:

//初始化 
var ddlMenu = $('#helloEasyUI').menubutton({ menu: '#cusmenu' });  
  
//menubutton 依赖于 menu、linkbutton 这两个插件,所以可以用如下代码实现:
$(ddlMenu.menubutton('options').menu).menu({ 
            onClick: function (item) { 
                //item 的相关属性参见API中的menu 
                alert(item.text); 
            } 
}) 

以上来源:http://www.kqiqi.com/knowledge/program/easyui-menubutton.html


我的补充:

如果:<a id="m_datasource" href="#" class="easyui-menubutton"
data-options="menu:'#mm_datasource',iconCls:'icon-edit'">数据源</a>

<div id="mm_datasource" style="width:100px;">
<div>Oracle数据源</div>
<div>SQLServer数据源</div>
<div>Mysql数据源</div>
<div class="menu-sep"></div>
<div>Excel文件</div>
<div>CSV文件</div>
<div>Txt文件</div>
<div class="menu-sep"></div>
<div>剪切板</div>


</div>



那么脚本就可以这么写: $("#mm_datasource").menu({ 
              onClick: function (item) { 
                  //item 的相关属性参见API中的menu 
                  console.log(item.text); 
              } 
  });

这是因为这个MM就是一个MENU

版权声明:本文为博主原创文章,未经博主允许不得转载。

本文转载自:http://blog.csdn.net/xiaohelong2005/article/details/19162269

粉丝 22
博文 255
码字总数 111936
作品 0
长沙
项目经理
私信 提问
EasyUI 1.5.x Of Insdep Theme 1.0.0 RC2 发布

JQuery EasyUI 1.5.x Of Insdep Theme 1.0.0 RC2 下方附部分美化截图 关于 Insdep theme是基于EasyUI 1.5.x 的一款免费的美化主题包,拥有百度编辑器、cropper、Highcharts、justgage、plupl...

magicweng
2017/02/27
2.2K
5
jQuery-EasyUI 1.2.3 发布

Current Version: 1.2.3 ChangeLog: Bug window: Cannot resize the window with iframe content. fixed. tree: The node will be removed when dragging to its child. fixed. combogrid: T......

ejzhang
2011/04/26
6.2K
3
jQuery EasyUI快速入门实战教程(一)-入门

1、jQuery EasyUI概述 jQuery EasyUI是一组基于jQuery的UI插件集合体,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript,...

神码小风
2018/06/28
0
0
jQuery EasyUI入门视频教程【20讲】

jQuery EasyUI入门视频教程【20讲】 jQuery EasyUI是一组基于jQuery的UI插件集合,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。非职业讲师孙宇讲授,全...

Amamatthew
2014/09/28
1K
0
EasyUI 1.5.x Of Insdep Theme 1.0.0 RC1 美化主题大包已发布

关于 Insdep theme是基于EasyUI 1.5.x 的一款免费的美化主题包,拥有百度编辑器、cropper、Highcharts、justgage、plupload等各类适应本主题的第三方插件美化补丁。并且各类常用Jquery插件正...

magicweng
2017/02/22
6.4K
24

没有更多内容

加载失败,请刷新页面

加载更多

使用TensorFlow的AI程序运行报错AttributeError: module 'tensorflow' has no attribute 'xxx'

使用TensorFlow的AI程序,在运行时报错AttributeError: module 'tensorflow' has no attribute 'xxx',首先检查是否是包路径不对,一般是版本变化所致。...

织梦之魂
55分钟前
3
0
提示浏览器版本低

本文转载于:专业的前端网站➭提示浏览器版本低 网站网页在遇到浏览器低版本(尤其是IE浏览器)时,提示浏览器版本低(如IE8以及以下),建议用户升级浏览器以获得最好体验。以下是代码: 1...

前端老手
57分钟前
6
0
CentOS 7系统增加swap

转载请注明文章出处:CentOS 7系统增加swap swap是位于磁盘上的特殊文件(或分区),属于“虚拟内存”的一部分。通俗点就是内存的备胎,内存充足的情况下,基本上没swap什么事(和设置有关)...

tlanyan
今天
6
0
基于Prometheus和Grafana的监控平台 - 环境搭建

相关概念 微服务中的监控分根据作用领域分为三大类,Logging,Tracing,Metrics。 Logging - 用于记录离散的事件。例如,应用程序的调试信息或错误信息。它是我们诊断问题的依据。比如我们说...

JAVA日知录
今天
6
0
PHP运行时全局构造体

struct _php_core_globals { zend_bool magic_quotes_gpc; // 是否对输入的GET/POST/Cookie数据使用自动字符串转义。 zend_bool magic_quotes_runtime; //是否对运行时从外部资源产生的数据使...

冻结not
今天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部