layui系列&&Bug++

最新推荐文章于 2022-03-26 13:28:52 发布

极赫赫

最新推荐文章于 2022-03-26 13:28:52 发布

阅读量155

点赞数

分类专栏：写前端的后端文章标签： layui html javascript

本文链接：https://blog.csdn.net/weixin_50927151/article/details/120183563

版权

写前端的后端专栏收录该内容

3 篇文章 0 订阅

订阅专栏

父级页面无法监听弹窗中html页面的按钮问题

    今天用layui画页面的时候发现:父级页面执行按钮，弹出新增弹窗后，弹窗中的一个上传按钮一直没办法监听；

起初代码是这样的


```html
 //添加类型
    $('#add').click(function(){
        layer.open({
            type: 1
            ,btn:['确定','取消']
            ,title: '新增图标'
            ,area: ['400px', '250px']
            ,content: setTypeHtml('图标名称')
            ,btnAlign: 'c',
            success:function(layero, index){
                $("[name='content']").val("请审核");
            },
            yes: function(index, layero) {
                if($("#typeName2").val().trim()==""){
                    parts.tip("请输入图标名称！");
                    $("#content input").css("border-color","#FF5722");
                    return;
                }
                var typeName = $("#typeName2").val();
                var systemCode = $('#systemCode').val();
                var submitUrl = inurl.flowFull('/flowNewController/addTypeInfo');
                // alert(submitUrl);
                var params = {'systemCode':systemCode,'typeName':typeName};
                //alert(params)
                // return ;
                var lock = true;
                if(lock) {
                    $.ajax({
                        url:submitUrl,
                        type:'POST',
                        data:params,
                        success:function(res){
                            var data = res.data;
                            var code = res.code;
                            if(code=='1'){
                                layer.msg('保存成功');
                                layer.closeAll();
                                refreshNode();
                            }else{layer.msg('保存失败');}

                        },
                        error:function(){
                            parts.error("保存错误","ajax请求报错");
                        }
                    });
                }

            }
        });
      
    });

    function setTypeHtml(titleName,typeName){
        if(isEmpty(typeName)) typeName= '';
        var content = new Array();
        content.push(' <div class="layui-tab-content">');
        /*其他渲染代码省略*/
        content.push('  <div class="layui-input-inline my-wd-lg">');
        content.push('  <button type="button" class="layui-btn" id="upload">上传图片</button>');
        content.push('  </div>');
        content.push(' </div> ');
        return content.join("");
    }

    $('#upload').click(function() {
        debugger
    })

后面找了一圈
发现问题是在上传按钮的方法应该写在加载弹窗之后，如下：
`` 修改后