zoukankan      html  css  js  c++  java
  • 嵌套 iframe 遮罩 及将iframe中的内容传递到父级

    1、点击父级a标签 改变iframe的src显示不同的内容

    <a target="iframe的name值" data="url地址" class="buttons"></a>
    <iframe id="show" name="iframe的name值" src="" scrolling="no" frameborder="0" 
    onload="this.height=this.contentWindow.document.documentElement.scrollHeight" style=" 100%;"></iframe>
    jQuery(".buttons").click(function () {
       jQuery(this).attr("href", jQuery(this).attr("data"));
    });

    2、遮罩

    在父级页面添加div

    //全屏遮罩
    <div id="mark" style="position: fixed; display: none; background: #ccc; opacity: .5; z-index: 98; padding: 10px;  100%; height: 100%;">
    </div>
    //显示内容
    <div id="msgs" style="position: fixed; display: none; z-index: 99; padding: 10px;  400px; right: 0px; top: 30%">
    </div>
    //点击删除
    <div id="msgsshow" style="position: fixed; display: none; text-align: center; line-height: 15px; z-index: 100; padding: 5px;
     border: 1px solid #ccc;  10px; height: 10px; right: 15px; top: 32%; border-radius: 50%;">X</div>

    在子页面添加相应的js

    <script>
            jQuery(document).ready(function () {
           //影藏所有相关遮罩
                jQuery("#msgs", window.parent.document).hide();
                jQuery("#msgsshow", window.parent.document).hide();
                jQuery("#mark", window.parent.document).hide();
           //点击遮罩的时候影藏全部内容
                jQuery("#mark", window.parent.document).click(function () {
                    jQuery("#msgs", window.parent.document).html("");
                    jQuery("#msgs", window.parent.document).hide();
                    jQuery("#msgsshow", window.parent.document).hide();
                    jQuery("#mark", window.parent.document).hide();
                })
                //
                jQuery("#msgsshow", window.parent.document).click(function () {
                    jQuery("#msgs", window.parent.document).html("");
                    jQuery("#msgs", window.parent.document).hide();
                    jQuery("#msgsshow", window.parent.document).hide();
                    jQuery("#mark", window.parent.document).hide();
                })
                jQuery(".showmsg").click(function () {
              //返回消息内容
                    jQuery.ajax({
                        type: "POST",
                        url: "/Manager/Handler/UpdateState.ashx",
                        data: { flag: "ArtMsg", intid: jQuery(this).attr("pid") },
                        success: function (data) {
                            if (data.status == "1") {
                                var str = "";
                                jQuery.each(data.msg, function () {
                                    if (this.NEXTSTATUS < 0) {
                                     str = str+"<div class='notibar msgerror'><p>错误信息:"+this.OPINION+" 时间:"+this.OPERATETIME + "</p></div>";
                                    } else {
                                    str = str+"<div class='notibar msgsuccess'><p>消息提醒:"+this.OPINION+"时间:"+this.OPERATETIME + "</p></div>";
                                    }
                                })
                                if (str == "") {
                                    str = "<div class='notibar msginfo'><p>没有响应的数据</p></div>";
                                }
                                jQuery("#msgs", window.parent.document).html(str);
                                jQuery("#msgs", window.parent.document).show();
                                jQuery("#msgsshow", window.parent.document).show();
                                jQuery("#mark", window.parent.document).show();
                            } else {
                                var stsr = "";
                                stsr = "<div class='notibar msginfo'><p>查询有误</p></div>";
                                jQuery("#msgs", window.parent.document).html(str);
                                jQuery("#msgs", window.parent.document).show();
                                jQuery("#msgsshow", window.parent.document).show();
                                jQuery("#mark", window.parent.document).show();
                            }
                        },
                        dataType: "json"
                    });
                });
                jQuery("#btnAdds").click(function () {
                    var path = (window.location.href).replace("?type=View", "");
                    var newpath = path.replace("List.aspx", "Edit.aspx?type=Add");
                    window.location.href = newpath;
    
                })
                //查询条件赋值
                jQuery("#btnSearch").click(function () {
                    var url = window.location.href;
                    if (url.indexOf('?') > 0)
                        url = url.split('?')[0];
                 window.location.href = url + "?type=View&roleid=<%=roleid%>&" + encodeURI(jQuery("#tableoptions input,select").serialize());
                });
            });
        </script>
  • 相关阅读:
    hashCode()相同,equals()也一定为true吗?
    什么是装箱?什么是拆箱?装箱和拆箱的执行过程?常见问题?
    LOJ114_k 大异或和_线性基
    BZOJ_4459_[Jsoi2013]丢番图_数学+分解质因数
    BZOJ_4184_shallot_线段树按时间分治维护线性基
    BZOJ_2844_albus就是要第一个出场_线性基
    BZOJ_3105_[cqoi2013]新Nim游戏_线性基+博弈论
    BZOJ_1195_[HNOI2006]最短母串_AC自动机+BFS+分层图
    BZOJ_3881_[Coci2015]Divljak_AC自动机+dfs序+树状数组
    BZOJ_1532_[POI2005]Kos-Dicing_二分+网络流
  • 原文地址:https://www.cnblogs.com/lovable/p/7122411.html
Copyright © 2011-2022 走看看