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

点击编辑按钮需要获取到表格里的信息
这里是父级页面
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(); } }); } }); });

浙公网安备 33010602011771号