Question

我正在寻找基于变量的jQuery片段，但我不确定解决这个问题的最佳方法。

我有两个选择字段，第一个字段包含值的选项，第二个字段包含数据值选项。根据在第一个选择字段中选择的选项/值，我需要动态更新第二个字段选项中的数据值。

我的HTML是：

<select required="" name="options" id="cab" class="select-model">
    <option selected="" data-value="0" disabled="disabled"></option>
    <option data-value="500" value="1" class="one">1x12 Cabinet</option>
    <option data-value="1000" value="2">2x12 Cabinet</option>
    <option data-value="1500" value="3">3x15 Cabinet</option>
    <option data-value="0" value="0">No cabinet</option>
</select>

<select required="" name="options" id="speaker" class="select-model">
    <option selected="" data-value="0" disabled="disabled"></option>
    <option data-value="0">Celestion</option>
    <option data-value="100" class="widow">Black Widow</option>
</select>

<var class="total">0</var>

我目前的jQuery片段是：

$("#cab").on('change', function () { 
    $("#cab").prop($(this).val() == "1x12 Cabinet");
    $(".widow").attr('data-value', 100);        
});

这很好但我需要分配一个变量，以便Black Widow的数据值是：

在#cab
在#cab

等...

我已经尝试过创建一个var map但是我担心我的jQuery还不够好！

任何帮助都会很棒！ Here's a link to a jsFiddle

Answer 1

$("#cab").on('change', function () { 
    var value = $(this).find('option:selected').val();
    $(".widow").attr('data-value', value * 100);
});

希望这有帮助！在这里更新了小提琴http://jsfiddle.net/aKkej/5/

jQuery - 如何根据另一个选项的值为选项分配数据值？

1 个答案: