0

Я думал это будет легко, но реально перепробовал уже все. В общем, по клику на кнопку с классом .button_flower, мне нужно получить html/text дива .catalogue_item_title, то есть текст "Сливки".

let name_buket = "";
$(".button_flower").click(function() {
  name_buket = $(this).parent().prev('.catalogue_item_title').html() // Почему то prev делает обращение к еще одному родителю, а не сестринскому элементу.

  name_buket = $(this).parent().parent().children('.catalogue_item_title') //Получаю объект из одного элемента, но не работает метод html()
  name_buket = $(this).closest('.catalogue_item_title') // Аналогично, получаю объект, но не могу вытянуть html

  $('#name_liked_buket').text(name_buket)
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<div class="catalogue_item">
  <div class="catalogue_item_title"><a href="/slivki.html">Сливки</a></div>
  <div class="catalogue_item_image"><img src="img/img1.jpg" alt=""></div>
  <div class="catalogue_item_desc">Букет невесты в нежных тонах из роз, с добавлением гипсофилы и рускуса. Бутоньерка для жениха в подарок.</div>
  <div class="catalogue_item_price">1050</div>
  <div class="catalogue_item_more"><a href="#" id="go" class="button_flower">Заказать</a></div>
</div>


<div id="name_liked_buket">+</div>

1 ответ 1

0

по клику на кнопку с классом .button_flower, мне нужно получить html/text дива ".catalogue_item_title", то есть текст "Сливки".

Предложу такой вариант...

let name_buket = "";
$(".button_flower").click(function() {
  name_buket = $(this).parents('.catalogue_item').find('.catalogue_item_title').text()
  console.log(name_buket)
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<div class="catalogue_item">
  <div class="catalogue_item_title"><a href="/slivki.html">Сливки</a></div>
  <div class="catalogue_item_image"><img src="img/img1.jpg" alt=""></div>
  <div class="catalogue_item_desc">Букет невесты в нежных тонах из роз, с добавлением гипсофилы и рускуса. Бутоньерка для жениха в подарок.</div>
  <div class="catalogue_item_price">1050</div>
  <div class="catalogue_item_more"><a href="#" id="go" class="button_flower">Заказать</a></div>
</div>


<div id="name_liked_buket">+</div>

Вот вариант через родителей... Вот только нужно правильно понимать с чем ты имеешь дело.

$(".button_flower").click(function() {
  let name_buket = $(this).parent().parent().children('.catalogue_item_title') 
  name_buket = name_buket.text()
  console.log(name_buket)
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<div class="catalogue_item">
  <div class="catalogue_item_title"><a href="/slivki.html">Сливки</a></div>
  <div class="catalogue_item_image"><img src="img/img1.jpg" alt=""></div>
  <div class="catalogue_item_desc">Букет невесты в нежных тонах из роз, с добавлением гипсофилы и рускуса. Бутоньерка для жениха в подарок.</div>
  <div class="catalogue_item_price">1050</div>
  <div class="catalogue_item_more"><a href="#" id="go" class="button_flower">Заказать</a></div>
</div>

3
  • Спасибо, работает. Непоятно только, почему нельзя напрямую работать с parent>child, closest
    – Amigo9876
    Commented 29 янв. 2023 в 11:21
  • @Amigo9876, все можно... Тут главное правильно понимать кто будет parent. ;) Ты ведь клацаешь по ссылке и parent у нее <div class="catalogue_item_more">...
    – ksa
    Commented 29 янв. 2023 в 11:52
  • @Amigo9876, смотри - я добавил вариант работы через parent(). И сличи с тем что делал ты.
    – ksa
    Commented 29 янв. 2023 в 11:59

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

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