Question

我需要帮助循环浏览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内的所有内容都是可变的，包括标签，名称和ID

我想要做的就是有人更新任何一个选定的选项，我需要弄清楚他们选择哪个选择元素并获得价值。因此，例如，如果他们将颜色选项更新为蓝色，我需要在jquery中触发一个调用，以显示id为colorOpt的select元素已更新为值3

我完全不知道如何做到这一点。从这开始，但不确定它是否正确

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


});

Answer 1

看起来你开始认为你需要遍历每一个选择...但是因为你说你需要＆＃34;找出他们选择的选择元素＆＃34;您可以依赖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);
});

Answer 2

$('select').on('change',function(){
   var value = $(this).val();
   alert(value);
});

Answer 3

只要有喜欢的人帮助我，就可以帮助您。

我搜索了一个脚本，该脚本可用于根据所选值附加一些内容。

这是我想出的。 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>');
    }
});

jquery在选项更改时循环选择标记

3 个答案: