jQuery:append - Копировать блок <div>
И снова здрасти :)
Не неделя выдалась, а одни баги) Ситуация такая, в HTML странице есть несколько <div> блоков, у каждого из них уникальный id. Мне нужно взять эти блоки по id и поместить их в другую часть странице сайта. Подобное реализовано по средствам jQuery:append
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
$("p").append("<div id='info'>Hello</div>");
});
</script>
<style>p { background:yellow; }</style>
</head>
<body>
<p>I would like to say: </p>
</body>
</html>
Но тут нужно вставлять весь текст а не просто имя идентификатора id. Подскажите как подправить чтоб можно было указать имя id и эти блоки с содержимым были скопированы в другое место сайта ? |
Похоже понедельник прошел и все стала на круги своя :)
Решение найдено:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
function cloNeN() {
$("#container").clone() // сделаем копию элемента Привет, Пока, Привет
.addClass("newElement") // добавим этой копии класс newElement
.appendTo("#clone"); // вставим измененный элемент в конец элемента clone
}
</script>
</head>
<body onload="cloNeN()">
<div id="container">
<div id="ih" class="hello">Привет</div>
<div id="ih1" class="goodbye">Пока</div>
<div id="ih2" class="hello">Привет</div>
</div>
</br>
<div id="clone"></div>
</body>
</html>
Результат: Цитата:
Может кто знает как клонировать несколько идентификаторов сразу ? |
$("#ih, #ih1, #ih2").clone().addClass("newElement").appendTo("#clone");
|
Цитата:
Столкнулся ещё с небольшой проблемкой, пытаюсь взять текст с <div id="donor">Test Clone</div> и клонировать его в значения value="" т.е. чтоб получилось value="Test Clone" Вот как реализовываю:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
function cloNeN() {
$("#clonevalue").attr({value: "", value: $("#donor")});
}
</script>
</head>
<body onload="cloNeN()">
<div id="donor">Test Clone</div>
</br>
<input type="text" id="clonevalue" value="">
</body>
</html>
Но результат выходит такой: value="[object Object]" Подскажите плиз где ошибка ? |
|
|
Цитата:
|
Цитата:
Цитата:
Цитата:
Все просто :) Но почему то не работает. |
Цитата:
$("#donor");
Вот таким образом вы получите объект, а не его текст. Попытавшись вывести его (что, фактически и происходит) Вы получаете строчку "[object Object]". Для того чтобы найти "внутренности" полученного объекта надо воспользоваться функцией .text(), ссылка опять же дана выше (есть еще функция .html(), но сейчас она не нужна). Немного чтения документации и действительно будет все просто. И будет работать впридачу. |
Нашел ошибку свою, вообще не так функцию составил :)
Спасибо skfyann за наводку. Собственно решение:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
function cloNeN() {
var text = $("#donor").text();
$("#clonevalue").val(text);
}
</script>
</head>
<body onload="cloNeN()">
<div id="donor">Test Clone</div>
</br>
<input type="text" id="clonevalue" value="">
</body>
</html>
|
| Часовой пояс GMT +3, время: 10:59. |