JQuery получить текущее значение выбора текущего параметра

У меня разные варианты выбора (по количеству) после кнопки

  <button type = "button" class = "btn btn-sm btn-primary" id = "addtocart2" >Button1</button>
                    <select  id = "quantity1"  class = "ml-1">

                        <option value = "4">4</option>

                    </select>

                     <button type = "button" class = "btn btn-sm btn-primary" id = "addtocart2" >Button2</button>
                    <select  id = "quantity1"  class = "quantity ml-1"> 

                        <option value = "3">3</option>

                    </select>

то, что я хочу, - это когда я нажимаю кнопку 1, я получаю 4, а когда нажимаю кнопку 2, я получаю 3.

что-то вроде

 var nextoption =   $('button[id* = "addtocart"]').click(function()  { console.info($(this).closest('select').text()); });

заранее спасибо.

javascript jquery html

14.06.2018 21:39

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Ответы 3

closest() используется для получения ближайшего элемента родитель, соответствующего селектору. Элементы select являются братьями и сестрами, поэтому вместо них вам понадобится next(). Также, чтобы получить значение выбранной опции, используйте val():

var nextoption = $('button[id* = "addtocart"]').click(function() {
  console.info($(this).next('select').val());
});

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type = "button" class = "btn btn-sm btn-primary" id = "addtocart2">Button1</button>
<select id = "quantity1" class = "ml-1">
  <option value = "4">4</option>
</select>

<button type = "button" class = "btn btn-sm btn-primary" id = "addtocart2">Button2</button>
<select id = "quantity1" class = "quantity ml-1">
  <option value = "3">3</option>
</select>

14.06.2018 21:41

Просто используйте метод .next(), чтобы получить следующий родственный элемент кнопок, и, как всегда, используйте метод .val() для извлечения текущего значения поля формы.

$("button[id*='addtocart']").on("click", function(){
  console.info($(this).next().val());
});

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type = "button" class = "btn btn-sm btn-primary" id = "addtocart2" >Button1</button>
<select  id = "quantity1"  class = "ml-1">
   <option value = "4">4</option>
</select>

<button type = "button" class = "btn btn-sm btn-primary" id = "addtocart2" >Button2</button>
<select  id = "quantity1"  class = "quantity ml-1"> 
  <option value = "3">3</option>
</select>

14.06.2018 21:43

Вы также можете использовать :selected для доступа к выбранной опции.

$('#addtocart1').click(() => {
  console.info($('#quantity1 option:selected').val());
});

$('#addtocart2').click(() => {
  console.info($('#quantity2 option:selected').val());
});

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type = "button" class = "btn btn-sm btn-primary" id = "addtocart1">Button1</button>
<select id = "quantity1" class = "ml-1">
  <option value = "3">3</option>
  <option value = "4">4</option>
  <option value = "5">5</option>
</select>

<button type = "button" class = "btn btn-sm btn-primary" id = "addtocart2">Button2</button>
<select id = "quantity2" class = "quantity ml-1">
  <option value = "4">4</option>
  <option value = "3">3</option>
  <option value = "2">2</option>
</select>

14.06.2018 22:40

Другие вопросы по теме

Как преобразовать пользовательское модальное окно CSS в модальное окно Bootstrap?

Отправка данных с помощью jquery ajax в MVC с методом ADO.NET

Элемент длины форматирования jQuery Datatables

Использование JQuery Datepicker (элементы с повторяющимися идентификаторами)

JQuery не добавляет класс в браузер Firefox, но работает в Chrome

Как остановить все видео YouTube при изменении параметра в списке выбора

Избегайте Veracode CWE-80: неправильная нейтрализация связанного со скриптами HTML в методе jquery htm ()

Обратный вызов после того, как несколько обещаний были возвращены до того, как обещания были разрешены в jQuery 2.1, но не в 3.1

В текстовом поле всегда должно быть 5 цифр

Как просмотреть данные из БД с помощью AJAX сразу после того, как скрипт их посчитает?

JQuery получить текущее значение выбора текущего параметра

Ответы 3

Другие вопросы по теме

Похожие вопросы