做WEB前端开发的过程中，经常会有这样的需求，用户点击【编辑】按钮，弹出一个对话框，在里边修改相应的值，然后把修改后的值显示在原页面，最后点击保存。
用window.ElementById().setAttribute("value","")可以很好的解决这个问题。
源代码如下：
父页面中的代码：
<!doctype html>
<html lang="en"><head><meta charset="UTF-8"><title>Document</title><meta name="Keywords" content=""><meta name="Description" content=""></head><body style="height:3000px"><input type="text" id="parent"><button id="parentBtn">编辑</button><div class="clear" style="width:500px;height:200px;border:1px solid red;position:fixed;top:100px;left:100px;display:none"><iframe src="son.html" style="border:none"></iframe></div><button id="content">获取内容值</button></body>
</html>
<script type="text/javascript" src=".js"></script>
<script type="text/javascript">$("#parentBtn").click(function(){$(".clear").show();})$("#content").click(function(){alert($("#parent").val());})
</script>子页面中的代码：
<!doctype html>
<html lang="en"><head><meta charset="UTF-8"><title>Document</title><meta name="Keywords" content=""><meta name="Description" content=""></head><body><input type="text" id="son"><button id="sonBtn">确定</button></body>
</html>
<script type="text/javascript" src=".js"></script>
<script type="text/javascript">$("#sonBtn").click(function(){var $val = $("#son").val();$("#parent", window.parent.document).val($val);//jQuery写法给父页面传值大笑//window.ElementById("parent").setAttribute("value",$val);//原生javascript写法给父页面传值$(".clear", window.parent.document).hide();//jQuery写法控制父页面中的某个元素隐藏//window.ElementsByClassName("clear")[0].style.display = "none";//原生javascript写法控制父页面中的某个元素隐藏})
</script>关键代码：
$("#parent", window.parent.document).val($val);//jQuery写法给父页面传值
//window.ElementById("parent").setAttribute("value",$val);//原生javascript写法给父页面传值
$(".clear", window.parent.document).hide();//jQuery写法控制父页面中的某个元素隐藏
//window.ElementsByClassName("clear")[0].style.display = "none";//原生javascript写法控制父页面中的某个元素隐藏
本文发布于:2024-01-29 01:30:50，感谢您对本站的认可！
本文链接：https://www.4u4v.net/it/170646305511744.html
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
| 留言与评论（共有 0 条评论） |
