Нужно при клике передать содержимое одного div в другой
Приветствую! Помогите как сделать.
Что нужно: Есть список клиентов, для примера их 2-а.
<div id="spisok_clientov">
<!-- Первый клиент !-->
<div id="client">
<div class="photo"><img src="img.png"/></div>
<div class="name">Пупкин</div>
</div>
<!-- Второй клиент !-->
<div id="client">
<div class="photo"><img src="img2.png"/></div>
<div class="name">Сидоров</div>
</div>
</div>
<!-- В этот div нужно подставлять фото и имя клиента, на которого нажмешь !-->
<div id="Result"></div>
Как лучше это реализовать. Надеюсь понятно объяснил Т.е. Если кликнуть на первый id=client, то нужно чтобы в id="Result" подставилось содержимое первого id=client
<div id="Result">
<div class="photo"><img src="img.png"/></div>
<div class="name">Пупкин</div>
</div>
|
toren, ИД должен быть уникальным на странице.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
$('.client').click(function(){
$('#Result').text($(this).find('.name').text());
});
});
</script>
</head>
<body>
<div id="spisok_clientov">
<!-- Первый клиент !-->
<div class="client">
<div class="photo"><img src="img.png"/></div>
<div class="name">Пупкин</div>
</div>
<!-- Второй клиент !-->
<div class="client">
<div class="photo"><img src="img2.png"/></div>
<div class="name">Сидоров</div>
</div>
</div>
<!-- В этот div нужно подставлять фото и имя клиента, на которого нажмешь !-->
<div id="Result"></div>
</body>
</html>
|
ksa,
лучше на контейнер вешать через .on и указывать доп. параметр
$('#clients-list').on('click', '.client', function(){
Так выйдет один обработчик, а не толпа в случае если клиентов дофига |
Цитата:
|
| Часовой пояс GMT +3, время: 14:40. |