jQuery BlockUI iframe答案

【问题标题】：Jquery BlockUI IframejQuery BlockUI iframe
【发布时间】：2011-06-19 19:08:21
【问题描述】：

我想使用 BlockUI jQuery 插件阻止 IFRAME 元素。

请举例说明如何做到这一点。

【问题讨论】：

给 iframe 计时？？请改进您的问题，我不明白...
@user587159 - 您需要在遇到问题的问题中发布代码。没有它就不可能帮助你。

标签： jquery iframe blockui

【解决方案1】：

您是否考虑过查看 BlockUI 文档？

我认为http://jquery.malsup.com/block/#element 正是您想要的。我不完全确定在 iframe 加载外部站点的情况下这是否有效，因为它似乎修改了元素的 DOM，而不仅仅是在元素外部创建覆盖。

【讨论】：

感谢您的回复，我正在尝试使用 iframe 加载外部网站完全相同，但它不起作用，请您建议任何替代方法

【解决方案2】：

我相信这就是你所追求的。正如 ThiefMaster 解释的那样，您需要在 iframe 周围包裹一个外部 DIV 元素。

<div id="iframeContainer" style="width:800;height:600px;">
    <iframe src="http://www.google.com" width="100%" height="100%"></iframe>
</div>

<script type="text/javascript">
    $(function () {
        $('#btn').click(function () {
            $('#iframeContainer').block({ message: null });
        });
    }); 
</script>

【讨论】：

【解决方案3】：

在 jquery.block.js 之前包含脚本 jquery.min.js，工作示例：

<html>
<head runat="server">
    <title>BlockUISample</title>
    <script src="<%: Url.Content("~/Scripts/jquery-1.4.4.min.js") %>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/jquery.blockUI.js") %>" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#btn').click(function () {
                $('#iframeContainer').block({ message: null });
            });
        }); 
    </script>
</head>
<body>
    <div>
        <input type="button" id="btn" value="block"></input>
        <div id="iframeContainer" style="width: 800; height: 600px;">
            <iframe src="http://www.google.com" width="100%" height="100%"></iframe>
        </div>
    </div>
</body>
</html>

【讨论】：