Question

如何使用jquery overlay加载外部页面的一部分？

我有一个aspx调用TipoFactor.aspx，它在内容占位符中有一个div，如下所示：

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <br />
        <div id="DivGeneral" runat="server" class="tablaPaddingFiveCeleste">

正如您所看到的那样，“DivGeneral”是我想要加载到叠加层中的，它定义如下：

<a href="TipoFactorSeleccion.aspx" rel="#overlay">
                <button type="button">
                    Pagina Externa</button>
            </a>
            <!-- overlayed element -->
            <div class="apple_overlay" id="overlay">
                <!-- the external content is loaded inside this tag -->
                <div class="contentWrap">
                </div>
            </div>
            <script type="text/javascript">
                $(function() {
                    // if the function argument is given to overlay, 
                    // it is assumed to be the onBeforeLoad event listener 
                    $("a[rel]").overlay({

                        expose: 'darkred',
                        effect: 'apple',

                        onBeforeLoad: function() {

                            // grab wrapper element inside content 
                            var wrap = this.getContent().find(".contentWrap");

                            // load the page specified in the trigger 
                            wrap.load(this.getTrigger().attr("href"));
                        }

                    });
                });
            </script>

因为它现在将整个页面加载到叠加层中，这对我不利，因为它从与另一个相同的母版页继承。我需要保留该主页，因为它具有一些重要的应用程序功能。

我该怎么办？非常感谢你。

Answer 1

假设我理解正确，当您使用jQuery“load（）”API时，您可以在URL字符串中隐藏jQuery选择器表达式：

$('#loadDestination').load('http://some.where/content #onlyThisPart', function() { ... });

告诉jQuery在响应正文中查找“#onlyThisPart”，这就是它添加到主文档中的全部内容。

因此，你可以改变你的代码：

// ...
wrap.load(this.getTrigger().attr("href") + ' #divGeneral');

或任何“id”值标记内容的开始位置。

使用jquery覆盖外部页面的一部分

1 个答案: