模式对话框

最新推荐文章于 2021-12-06 20:45:06 发布

海边拾贝seebit

最新推荐文章于 2021-12-06 20:45:06 发布

阅读量114

点赞数

分类专栏： Web前端

本文链接：https://blog.csdn.net/Ada_yangyang/article/details/81237667

版权

Web前端专栏收录该内容

54 篇文章 1 订阅

订阅专栏

一、实现功能：将子窗口中选中的值传入到父窗口中。

父窗口：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
    <title>Title</title>
</head>
<body>
<script type="text/javascript">
    function copen(){
        //打开了一个模式对话框 子窗口中用window.returnValue就把值传入到父窗口中。
        var city = window.showModalDialog("Demo5.html");
        document.getElementById("city").value=city;
    }
    function copen2(){
        window.open('Demo5.html');
    }
</script>
<input type="text" id="city"/><input type="button" value="打开子模式对话框" onclick="copen()"/>
</body>
</html>

子窗口：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
    <title>Title</title>
    <script type="text/javascript">
        //通过this来实现传对象，在函数中定义参数可以接收到对象。
        function retval(a){
            window.returnVal=a.value;
            window.close();
        }
    </script>
</head>
<body>
<input type="radio" name="city" value="北京" onclick="retval(this)"/>北京
<input type="radio" name="city" value="上海" onclick="retval(this)"/>上海
<input type="radio" name="city" value="长沙" onclick="retval(this)"/>长沙
<input type="radio" name="city" value="山东" onclick="retval(this)"/>山东
</body>
</html>

二、将父窗口中文本框的值写入到子窗口中。

父窗口：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
    <title>Title</title>
</head>
<body>
<script type="text/javascript">
    function copen2(){
        window.open('Demo7.html');
    }
</script>
<input type="text" id="city"/><input type="button" value="打开子窗口" onclick="copen2()"/>
</body>
</html>

子窗口：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
    <title>Title</title>
    <script type="text/javascript">
        function showParentData(){
            //1.得到打开这个窗口的窗口
            alert(window.opener.document.getElementById("city").value);
        }
    </script>
</head>
<body onload="showParentData()">
<input type="radio" name="city" value="北京" onclick="retval(this)"/>北京
<input type="radio" name="city" value="上海" onclick="retval(this)"/>上海
<input type="radio" name="city" value="长沙" onclick="retval(this)"/>长沙
<input type="radio" name="city" value="山东" onclick="retval(this)"/>山东
</body>
</html>