dwz问题之动态生成的查找带回，点击没有弹出弹框(动态生成的dom，点击不能弹出dialog)

╰半夏微凉° 2021-09-15 12:20 296阅读 0赞

## 一、问题 ##

页面通过点击事件，生成一个查找带回按钮，点击这个按钮，应该弹出弹框，实际上是页面直接更换了链接。

## 二、原因 ##

通过点击事件生成的按钮，不能使用dwz的功能，原因是没有绑定，需要再次绑定这些功能。

## 三、结果 ##

在dwz的 dwz.ui.js 文件中新增一个自定义的函数

/* * ++ 自定义 再次初始dwz--lookup功能 */
    function reLookupGroup ( _box ) { 
      var $p = $(_box || document);
      console.log( $p )
      if ($.fn.lookup) $("a[lookupGroup]", $p).lookup();
    }
    // 下面是 dwz 框架的源码
    function initUI(_box){ 
        var $p = $(_box || document);
    
        $("div.panel", $p).jPanel();

然而，在页面的点击生成查找带回的事件中，调用自定义的函数

$('button').click(function(){ 
        var lookupGroupBtn = '<a class='btnLook' lookupGroup='paramsDefinition' width='1200' height='500' href='***/index'>查找带回</a>'
        $("#paramsDefinition", navTab.getCurrentPanel()).append(lookupGroupBtn );
        // 在js添加按钮后，调用自定义功能
        reLookupGroup();
    });

## 四、类似 ##

动态生成的dom节点，点击要出现dialog页面，也不能出现，都是同样的原理。在dwz.ui.js页面写一个函数，如：

/* * ++ 自定义 再次初始dwz--dialog功能 */
    function reDialog_Dwz( _box ) { 
        var $p = $(_box || document);
    
        $("a[target=dialog]", $p).each(function() { 
            $(this).unbind('click');
        });
        $("a[target=dialog]", $p).each(function(){ 
            $(this).click(function(event){ 
                var $this = $(this);
                var title = $this.attr("title") || $this.text();
                var rel = $this.attr("rel") || "_blank";
                var options = {};
                var w = $this.attr("width");
                var h = $this.attr("height");
                if (w) options.width = w;
                if (h) options.height = h;
                options.max = eval($this.attr("max") || "false");
                options.mask = eval($this.attr("mask") || "false");
                options.maxable = eval($this.attr("maxable") || "true");
                options.minable = eval($this.attr("minable") || "true");
                options.fresh = eval($this.attr("fresh") || "true");
                options.resizable = eval($this.attr("resizable") || "true");
                options.drawable = eval($this.attr("drawable") || "true");
                options.close = eval($this.attr("close") || "");
                options.param = $this.attr("param") || "";
    
                var url = unescape($this.attr("href")).replaceTmById($(event.target).parents(".unitBox:first"));
                DWZ.debug(url);
                if (!url.isFinishedTm()) {
                    alertMsg.error($this.attr("warn") || DWZ.msg("alertSelectMsg"));
                    return false;
                }
                $.pdialog.open(url, rel, title, options);
    
                return false;
            });
        });
    }
    // 下面是 dwz 框架的源码
    function initUI(_box){ 
        var $p = $(_box || document);
    
        $("div.panel", $p).jPanel();
     ……

使用，同生成查找带回按钮一样，在dom节点上添加后，调用自定义函数reDialog_Dwz()