zoukankan      html  css  js  c++  java
  • EasyUI组件新增方法与事件

    以window组件为例

    事件

    扩展事件直接定义在options中,可以再初始化组件时定义事件,也可以使用时临时定义事件。这里是组件初始化后在添加的。

    使用情景:添加,插入功能。主界面表格分别点击添加和插入按钮,打开子窗体后选择一些数据,再点击同一个确定按钮。根据传入的事件处理方法,在主界面添加或插入一行记录。

    <div id="win" class="easyui-window" title="My Window" style="600px;height:400px"
        data-options="iconCls:'icon-save',modal:true">
        Window Content
    </div>
    //窗体扩展按钮点击事件
    $("#win").window({
        onSelect: function () {
            alert("触发select事件");
        }
    });

    方法扩展

    方法需要扩展,options中没有。

    //窗体扩展按钮点击方法
    $.extend($.fn.window.methods, {
        select: function (jq) {
            //获取配置项
            var opts = $(jq).data('window').options;
            //调用配置项中定义的事件处理方法
            opts.onSelect.call(jq);
            //点击后立即关闭子窗体
            $(jq).window("close");
        }
    });

    这样在子窗体中添加一个按钮,执行 $("#win").window("select"); 就能触发onSelect事件。

    在主界面的添加和插入按钮分别定义一次options配置项,就能实现同一个子窗体的确定按钮,表现不同的行为。

  • 相关阅读:
    深度谈谈单例模式
    高并发的下的数据库设计
    D3开发中的资料整理
    IIS配置过程中的常见问题
    css3常用动画+动画库
    非常实用的10款网站数据实时分析工具
    Jquery中AJAX参数详细介绍
    首次使用Vue开发
    js 鼠标拖拽元素
    Oracle涂抹oracle学习笔记第10章Data Guard说,我就是备份
  • 原文地址:https://www.cnblogs.com/ggtc/p/14951631.html
Copyright © 2011-2022 走看看