JQuery загружаемая переменная хранится html в div

Друзья,JQuery загружаемая переменная хранится html в div

У меня есть простая страница. У меня есть div (назовем его #content), который содержит контент (в html), который я хочу сохранить в переменной.

<div id="content"> 
    <div id="left"> 
     <h1>Cool title</h1> 
     <p>text</p> 
    </div> 
    <div id="right"> 
     <p>more text</p> 
    </div> 
</div>

У меня тогда есть div, который привязан к функции щелчка через JQuery. При нажатии на него содержимое #content хранится в переменной, хранимойHTML и высоте до storedHeight. Затем он устанавливает высоту #content равным 0 и удаляет html внутри #content.

Затем при повторном нажатии он оживляет высоту назад к сохраненномуHeight, скажем 200px; он также перезагружает html обратно в div.

Проблема заключается в перезагрузке html в div. Как мне это сделать? Я пробовал:

storedHTML = $('#content').html(); //to store it 
$('#content').html(''); //to clear it 
$('#content').html(storedHTML); //to load it back up again

пытается загрузить его ... но безрезультатно.

Это сработало отлично, когда я впервые написал его, чтобы захватить текст из тэга p, свести его к минимуму и затем снова увеличить его. Например .:

storedText = $('p#example').text(); //to store it 
$('p#example').text(''); //to clear it 
$('p#example').text(storedText) //to load it back up again

Для этого HTML нагрузки, я попытался с помощью .html(), .text(), .data(), .load(). и комбинация .html() и .append()

Я явно терпеть неудачу. Я не могу понять, как загрузить html (несколько div и т. Д.) Обратно в этот div. Я хотел бы узнать правильный способ сделать это!

Благодарим вас за все ваши дальнейшие друзья помощи.

источник

2013-03-08 Jaime

Можете ли вы создать скрипку, иллюстрирующую эту проблему? (Это может быть проблема $ (document) .ready. –

Теперь я работаю над скрипкой. Я не думаю, что это проблема document.ready, переменная storedHTML была правильно заполнена в консоли. Также предыдущее использование это, с помощью простого .text(), отлично работает ... Проблема только в загрузке html обратно в div ... – Jaime

Вы пробовали использовать .hide() и .show()?

$('#content').hide(); 
$('#content').show();

Вы можете увидеть кучу примеров и документации здесь также: http://api.jquery.com/hide/

Кроме того, даже если ваш подход не является лучшим, он должен работать. Я не уверен, почему у вас возникли проблемы, но ниже код работает отлично для меня:

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="http://code.jquery.com/jquery-migrate-1.1.1.min.js"></script> 
</head> 
<body> 
<div id="content"> 
    <div id="left"> 
     <h1>Cool title</h1> 
     <p>text</p> 
    </div> 
    <div id="right"> 
     <p>more text</p> 
    </div> 
</div> 

<input type="button" value="Hide" onclick="hideContent()" /> 
<input type="button" value="Show" onclick="showContent()" /> 

</body> 
<script type="text/javascript"> 
    var storedHTML = ''; 

    function hideContent() { 
     storedHTML = $('#content').html(); 
     $('#content').html(''); 
    } 

    function showContent() { 
     $('#content').html(storedHTML); 
    } 

</script> 
</html>

источник

2013-03-08 02:11:17 Matt

У меня нет на самом деле! Я думаю, что это может сделать трюк. Мне все же очень любопытно , с целью обучения, как я могу загрузить html, который хранится в переменной в элемент (div). – Jaime

См. мой отредактированный ответ. Вставьте это в обычный html-файл и запустите его .. затем сравните его с тем, что у вас есть получил. – Matt

JQuery загружаемая переменная хранится html в div

ответ

Смежные вопросы