我正在尝试从下拉列表的选定选项中选择数据属性,然后将其放在一个文本框中.这也是我的第二个数据属性.我将要添加代码,只要用户更改选项(代码我已经写过,可以在这里抽象),但我想让这部分工作的第一.
- <select class="operations-supplier" name="operations-supplier">
- <option data-selected="latam" data-capacity="100000" value="
- 10">LATAM - Supplier A</option>
- <option data-selected="na" data-capacity="200000" value="20>">NA - Supplier B</option>
- <option data-selected="asia" data-capacity="300000" value="30">ASIA - Supplier C</option>
- </select>
- <input type="text" class="operations-supplierCapacity" readonly />
JQuery的
- var capacityValue = $('select.operations-supplier').find(':selected').attr('data-capacity').val();
- $('.operations-supplierCapacity').val(capacityValue);
解决方法
您可以在jQuery中使用
data()方法,另外添加一个
change事件用于下拉列表
- $(document).ready(function() {
- $('select.operations-supplier').change(function() {
- var capacityValue = $('select.operations-supplier').find(':selected').data('capacity');
- $('.operations-supplierCapacity').val(capacityValue);
- });
- });
你需要在$(document).ready(function(){…})中包装代码;,在DOM元素加载后绑定事件.
