Überlagerung nur ein Teil einer externen Seite mit JQuery

Question

Wie kann ich einen Teil einer externen Seite mit JQuery Overlay laden?

Ich habe einen ASPX Call tipofactor.aspx Wich hat einen DIV in einem Content -Place -Helder wie folgt:

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

Wie Sie sehen können, ist das "Teilende" die, die ich in das Overlay laden möchte. Wir sind so definiert:

<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>

Da es jetzt ist, laden die gesamte Seite in die Overlay und das ist nicht gut für mich, was die gleiche Meisterschaft wie das andere ineritiert. Ich muss diese Meisterseite behalten, da sie eine wichtige Aplikationsfunktionalität hat.

Was kann ich machen ?
Vielen Dank.

Answer 1

Angenommen, ich verstehe Sie richtig, wenn Sie die API von JQuery "Load ()" "verwenden, können Sie sich in einen Jquery -Selektorausdruck in Ihrer URL -Zeichenfolge schleichen:

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

Das sagt JQuery, dass sie im Reaktionskörper nach "#onlythispart" suchen sollen, und das ist alles, was es zu Ihrem Hauptdokument ergänzt.

So ändern Sie Ihren Code so etwas:

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

Oder was auch immer der "ID" -Warte ist, der markiert, wo Ihr Inhalt beginnt.