показывать только один div внутри iframe (javascript, JQuery ...) - PullRequest
9 голосов
/ 03 ноября 2010

Сначала позвольте мне сказать, что я полностью открыт для идей относительно другого подхода.

У меня есть и iframe как таковой:

<div id="testloadlogin">
      <iframe src="../security/login.aspx" width="400" height="500"
             scrolling="auto" frameborder="1">
      [Your user agent does not support frames or is currently configured
      not to display frames. However, you may visit
      <a href="../security/login.aspx">the related document.</a>]
      </iframe>
</div>

Страница, загружаемая с помощью iframe, имеетdiv называется loginInnerBox.Я только хочу отобразить loginInnerBox и все внутри него.

Есть идеи, как это сделать?Я думал о том, чтобы использовать Jquery или какой-нибудь javascript для удаления всего остального на странице, загруженной в iframe, хотя я не знал, как получить к нему доступ ...

Просто чтобы прояснить, я хочу, чтобы все на моей странице снаружиiframe, чтобы остаться нетронутым.Я хочу получить эквивалент $. ('Testloadlogin'). Load ('../ security / login.aspx' #loginInnerBox), который просто получит html loginInnerBox и поместит его в div testloadlogin.Однако мне нужна внутренняя обработка с другой страницы, которая поддерживается iframe, но не загружается Jquery.

Разметка страницы, загруженной iframe,

<body>
    <div>
    </div>.......
    <div class="AspNet-Login" id="ctl00_CLPMainContent_Login1">
        <div id="loginInnerBox">
            <div id="loginCreds">
                <table>
                </table>
            </div>
        </div>
    </div>
    <div>
    </div>....
</body>

Вам нужно больше информации, чем это?

Я пробовал это, это не дало эффекта:

<div class="ui-corner-all" id="RefRes">
        <div id="testloadlogin">
        <iframe onload="javascript:loadlogin()" id="loginiframe" src="../security/login.aspx"
             scrolling="auto" frameborder="1">
      [Your user agent does not support frames or is currently configured
      not to display frames. However, you may visit
      <a href="../security/login.aspx">the related document.</a>]
      </iframe>
        </div>
    </div>
    <script type="text/javascript">
        function loadlogin() {
            $('<body>*', this.contentWindow.document).not('#ctl00_CLPMainContent_Login1').hide();
        }
    </script>

Ответы [ 3 ]

5 голосов
/ 23 июля 2012

С помощью jQuery вы можете загружать не только содержимое URL, но и определенный селектор CSS из этого URL. Это был бы более чистый подход. Это вот так.

$("#area").load("something.html #content");

Через CSS Tricks

3 голосов
/ 03 ноября 2010
$("iframe").contents().find("*:not(#loginInnerBox)").remove();

Имейте в виду, что это будет работать только на iframes, загруженных из того же домена ( та же политика происхождения )

РЕДАКТИРОВАТЬ : Возможно, это удаляет потомков loginInnerBox.В этом случае вы можете попытаться клонировать его раньше:

var iframe   = $("iframe").contents(),
    loginBox = iframe.find("#loginInnerBox").clone();

iframe.find("*").remove();
iframe.append(loginBox);

Что-то в этом роде.

0 голосов
/ 03 ноября 2010

Добавьте это к <iframe> -elememt:

onload="$('body>*',this.contentWindow.document).not('#ctl00_CLPMainContent_Login1').hide();"

, чтобы скрыть всех дочерних элементов тела, кроме # ctl00_CLPMainContent_Login1

Если # ctl00_CLPMainContent_Login1 содержит больше, чем поле входа, у вас естьиспользовать предложение, используя clone (), опубликованное pex.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...