Цикл jquery по выбранным тегам при изменении параметра

Мне нужна помощь в переборе всех моих тегов select на моей html-странице и запуске некоторых функций при каждом изменении.

<div id="product_options">
     <label>Color</label>
     <select name="productOptions" id="colorOpt" style="margin-bottom:10px;">
          <option value="1">White</option>
          <option value="3">Blue</option>
     </select>
     <label>Size</label>
     <select name="productOptions" id="sizeOpt" style="margin-bottom:10px;">
         <option value="2">9oz</option>
         <option value="4">10oz</option>**strong text**
     </select>
</div>

Все внутри основного div является переменным, включая метку, имена и идентификаторы.

то, что я хочу сделать, это все, что кто-то обновляет любой из выбранных параметров, которые мне нужны, чтобы выяснить, какой элемент выбора они выбрали, и получить значение. Так, например, если они обновляют параметр цвета до синего, мне нужно вызвать вызов в jquery, чтобы показать, что элемент выбора с идентификатором colorOpt был обновлен со значением 3

Любые идеи, которые я полностью потерял относительно того, как это сделать. Начал с этого, но не уверен, правильно это или нет

$('#product_options').select("select").each(function(selected, index) {


});

javascript html jquery selectedtext
person Yeak    schedule 20.11.2014    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Похоже, вы начали думать, что вам нужно перебирать каждый выбор... но поскольку вы сказали, что вам нужно «выяснить, какой элемент выбора они выбрали», вы можете полагаться на ключевое слово this внутри обратного вызова change.

Скрипт: http://jsfiddle.net/vpqh3kjz/

Код:

// Every time someone updates either selected option fire a callback
$('#product_options select').change(function () {
    // `this` represents the element that changed
    var id = this.id;
    var value = this.value;

    // Do something with your data here
    console.log('select element id ' + id + ' was updated with ' + value);
});
person Lochlan    schedule 20.11.2014

arrow_upward
0
arrow_downward

Просто за помощь, если кому-то понравится этот вопрос, как мне.

Я искал скрипт, который я могу использовать, чтобы добавить что-то в соответствии с выбранным значением.

вот что я придумал. JSFIDDLE

Добавление кода при изменении значения поля выбора, а затем то, что находится в значении, может быть использовано для цикла, чтобы добавить это количество тегов в конкретный контейнер.

Примечание. Это может привести к ошибке, если у вас есть значения параметров, отличные от чисел.

// Every time someone updates selected option fire a callback
$('#product_options select').change(function () {
    var container = $('#container');
    container.empty();
    for(var i = 0; i< this.value; i++){
        container.append('<p> index: '+ i +" <br> value: "+ this.value +'</p>');
    }
});
person Bilal Ahmad    schedule 13.08.2018