2

По клику на кнопку, получаем текст из .dodo и копируем в .modal

$(function() {
  $('button').click(function() {
    var text = $('.dodo').text();
    $(".modal").append(text);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="bar">
  <div class="dodo">Котелок!</div>
  <button>УрраКнопка</button>
</div>

<div class="bar">
  <div class="dodo">ДОДО</div>
  <button>ДодоКнопка</button>
</div>

<div class="modal"></div>

Задача: по клику, вставлять в .modal текст ТОЛЬКО из блока .dodo, в котором он вместе с нажимаемой кнопкой, находятся внутри своего div'a .bar. Т.е. провести работу скрипта только внутри родителя, в котором и кнопка и блок с текстом находятся.

Сейчас по клику, в блок .modal вставляется текст из обоих источников. Полагаю, нужно использовать this, но не могу понять, как именно..

2 ответа 2

2
var text = $(this).closest(".bar").find(".dodo").text();

или

var text = $(this).siblings(".dodo").text();
2
  • при клике на разные кнопки вставляет текст из обоих dodo...там contenteditable jsfiddle.net/nnykrrpL/6
    – user33274
    19 апр 2018 в 7:08
  • Благодарю, использую ваш первый вариант!
    – Amsterdam
    19 апр 2018 в 11:00
1

Как то так, главное кнопку глубже не прячь.

$(function() {
  $('button').click(function() {
   var text = $(this).parent().find('.dodo').text();
    $(".modal").append(text);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="bar">
  <div class="dodo">Котелок!</div>
  <button>УрраКнопка</button>
</div>

<div class="bar">
  <div class="dodo">ДОДО</div>
  <button>ДодоКнопка</button>
</div>

<div class="modal"></div>

1
  • Спасибо за вариант!
    – Amsterdam
    19 апр 2018 в 11:01

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.