Dialog子页面向父页面添加数据

项目中常常在父页面弹出一个子页面,然后点击子页面向父页面增加数据,用到了sessionStorage,JSON

父页面代码如下

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <link rel="stylesheet" href="themes/metro/easyui.css" />
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.easyui.min.js"></script>
</head>
<body>
    <a href="#">弹出</a>
    <div id="dd">
       
    </div>
</body>
</html>
<script type="text/javascript">
    $("a").click(function () {
       $('#dd').dialog({
            title: 'My Dialog',
            width: 400,
            height: 200,
            closed: false,
            cache: false,
            //弹出页面需要用content,不能用url,否则子页面JS不会去执行
            content: "<iframe scrolling='auto' frameborder='0' src='children.html' style='width:100%; height:100%; display:block;'></iframe>",
            modal: true
        });
})
</script>
<script type="text/javascript">
    function d_close(name) {
        var array = [];
        //为了在后台观看数据的变化,赋值一个时间
        var mydate = new Date();
        //子页面传输的数据
        var obj = { "Name": name, "Sj": mydate.toLocaleTimeString() };
        //如果sessionStorage有值
        if (sessionStorage.getItem('Json') != null)
        {
            //将sessioStorage的值转化成Json对象
            var o = JSON.parse(sessionStorage.getItem('Json'))
            //输出Json对象
            for (var p in o)
            {
                //這里只是演式,判断要添加的数据是否已经添加过了,防止添加数据重复
                if (o[p].Name != "男")
                {
                    //添加数据
                    o.push(obj);
                    //更新sessionStorage
                    sessionStorage.setItem("Json", JSON.stringify(o))
                }
            }
            //这里只是测试,通常这里得到数据后,就可以用ajax执行一系列操作
            console.log(sessionStorage.getItem('Json'))
         }
        //如果第一次点击子页面,即sessionStorage没有值
        else
        {
            array.push(obj);
            sessionStorage.setItem("Json", JSON.stringify(array))
        }
 }
    </script>
子页面
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <link rel="stylesheet" href="themes/metro/easyui.css" />
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.easyui.min.js"></script>



</head>
<body>
    <span>测试</span>
</body>

</html>
<script type="text/javascript">
    $("span").click(function () {
        parent.d_close("男")
    })

</script>



                
评论 1 您还未登录,请先 登录 后发表或查看评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
©️2022 CSDN 皮肤主题:大白 设计师:CSDN官方博客 返回首页

打赏作者

maocheng82

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值