子页面获取父页面上的值

在写项目中,常会有子页面要获取到父页面上的值。将父页面上的信息填充到子页面上。

效果图

点击编辑按钮需要获取到表格里的信息

这里是父级页面

HTML部分:

                <tr class="table-content">
                    <input type="hidden" value="1"/>
                    <td>011111</td>
                    <td>管理员2</td>
                    <td class="operate">
                        <button class="edit" type="button" onclick="AuthorEdit(this)">编辑</button>
                        <button class="listAuthor" type="button" onclick="AuthorList(this)">菜单权限</button>
                    </td>
                </tr>

js部分:

//编辑按钮的click事件
    function AuthorEdit(edit){//形参
        var $this= $(edit);
        var tr = $this.closest("tr");
        var id_input = $(tr).children("input");
        var id_val = $(id_input[0]).val();//id 主键

        var tds = $(tr).children("td");
        var js = $(tds[1]).text();//角色
        top.showLayer();//在子页面中操作父级窗口top=window.parent
        layer.config({
            skin: 'demo-class'//layer插件改变弹出框头部样式
        })
        lay = layer.open({
            title: '编辑',
            type: 2,
            area: ['500px', '226px'],
            shadeClose: false,

            content: 'pop/AuthorAddPop.html?id='+id_val+"&js="+js,

            /*右上角关闭按钮*/
            cancel: function(index, layero){
                top.hideLayer();//隐藏home页面的遮罩层
            }
        });
    }

//弹出框通用取消按钮事件
function closeLay(){
layer.close(lay);//关闭弹出层
top.hideLayer();
}

子页面

将父级页面上的管理员获取到在子页面上显示

$(function () {
        $(".cancelAdd").on("click", function () {/*这里是取消按钮,当点击取消按钮 关闭layer弹出框*/
            parent.closeLay();
        });
        /*获取url参数*/
        function getUrlParam(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
            var r = window.location.search.substr(1).match(reg);  //匹配目标参数
            if (r != null) return decodeURI(r[2]);//将解码方式unscape换为decodeURI解决中文乱码问题
            return null; //返回参数值
        }
        var id = getUrlParam("id");
        var js = getUrlParam("js");
        //alert("id="+id+"|js="+js);
        $(".jsmc").val(js);
});

这个是确认按钮

    //新增弹出框中的确认按钮事件
    $(function () {
        $(".SureAdd").on("click", function () {

            if ($(".jsmc").val() == "") {//非空判断
                $(".ComHint").css("visibility", "visible");
                return false;
            } else {
                $.ajax({
                    url: "",
                    type: "post",
                    dataType: "json",
                    data: {
                        jsmc: $(".jsmc").val()/*键值对 获取角色名称传给后台*/
                    },
                    success: function () {
                        parent.closeLay();
                    },
                    error: function () {
                        alert("确认失败!");
                        parent.closeLay();
                    }
                });
            }
        });
    });

 

posted @ 2017-04-13 15:23  三高娘子  阅读(3264)  评论(0)    收藏  举报