0

Ребят, всем привет. Есть такая верстка:

<div class="product_list">
<input type="hidden" value="1" name="id"/>
<button class="add_cart">Добавить<span></span></button>
</div>

<div class="product_list">
<input type="hidden" value="2" name="id"/>
<button class="add_cart">Добавить<span></span></button>
</div>

<div class="product_list">
<input type="hidden" value="3" name="id"/>
<button class="add_cart">Добавить<span></span></button>
</div>

Когда нажимаю на "добавить", я хочу получить значение inputa name='id'. Как это реализовать из данной верстке?

3 ответа 3

2
$(document).on('click', '.add_cart', function() {
    var id = $(this).prev().val();
    alert(id);
});

или если вёрстка таки поменяется

$(document).on('click', '.add_cart', function() {
    var id = $(this).closest('.product_list').find('input[name="id"]').val();
    alert(id);
});
2
  • мля это совсем не годиться, я же могу между inputami поставить некий html код. И он сразу перестанер работать!
    – duddeniska
    27 мар 2015 в 12:40
  • @duddeniska, хм... Ты дал пример кода, на его основе мы и помогаем, ты же не написал что-то типа: <input type='hidden' /> /* Тут может быть код */ <input type='button' />
    – user31688
    27 мар 2015 в 12:43
1

jsfiddle.net/30dw5ncs/

Вот оптимальнее вариант, на родном JS

jsfiddle.net/30dw5ncs/1/

$('.add_cart').on('click', function(){
    var id = this.previousElementSibling.value;
    
    alert(id);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="product_list">
<input type="hidden" value="1" name="id"/>
<button class="add_cart">Добавить<span></span></button>
</div>

<div class="product_list">
<input type="hidden" value="2" name="id"/>
<button class="add_cart">Добавить<span></span></button>
</div>

<div class="product_list">
<input type="hidden" value="3" name="id"/>
<button class="add_cart">Добавить<span></span></button>
</div>

4
  • тут правильнее использовать сиблингов, а не парента 27 мар 2015 в 12:37
  • @norbornen, я jQuery не пользуюсь, так что...
    – user31688
    27 мар 2015 в 12:41
  • док почти работает, но только у меня выше написан select, и он никак не хочет брать его значения.
    – duddeniska
    27 мар 2015 в 12:50
  • @TheDoctor, ты дал ответ на jquery и ты за ответ отвечаешь 27 мар 2015 в 12:56
0

Решение строится на основе этих 2х вещей:

  1. Get the siblings of each element in the set of matched elements, optionally filtered by a selector

  2. Attribute Equals Selector

7
  • @norbornen, вряд ли тот, кто задаёт такие вопросы, будет читать маны, да ещё на инглише.
    – user31688
    27 мар 2015 в 12:37
  • и поэтому ты считаешь, что нужно, не объясняя, набросать на фидле любое решение? ну ок, чо 27 мар 2015 в 12:39
  • Нет, я люблю объяснять решение, но есть случаи, когда это вряд ли стоит делать.
    – user31688
    27 мар 2015 в 12:40
  • не ребятЮ спасибо, я использую сейчас sublings Но есть небольшой гемор в том что в этом блоке есть в самом начале select, а намного ниже вот этот код, так вот input значения я получаю, те что рядом с кнопкой, а значение select не могу, вот и спрашиваю, может есть какие то другие решения?
    – duddeniska
    27 мар 2015 в 12:41
  • 1
    @duddeniska, я почти не понял набор слов в твоём комментарии про селект. Имею сказать вот что - ты написал: html, вопрос и уточнение "Как это реализовать из данной верстке?", тебе даны ответы, работающие в данных условиях. И тут ты зачем-то начинаешь рассказывать про какой-то селект. Удали вопрос, остановись, подумай, сформулируй заново. Иначе это не вопрос, а какое-то гадание о том, что осталось за скобками. 27 мар 2015 в 12:54

Ваш ответ

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

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