根据从下拉列表中选择的内容自动填充输入

Question

让我们说我有一个产品的下拉列表（），在它下面我输入了你输入价格的输入。如何设置以便我可以为每个下拉项设置价格，当选择该下拉项时，它的价格会自动进入输入？

Answer 1

简单的例子，我希望你的问题是

＆＃13;

＆＃13;

$(document).ready(function() {

  $('#price_input').on('change', function() {
    $selection = $(this).find(':selected');
    $('#opt_value').val($selection.val());
    $('#opt_price').val($selection.data('price'));
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="price_input">
  <option value="price1" data-price="10">Price 1</option>
  <option value="price2" data-price="30">Price 2</option>
  <option value="price3" data-price="22">Price 3</option>
</select>
<div>Option Value <input type="text" id="opt_value"/></div>
<div>Option Price <input type="text" id="opt_price"/></div>

＆＃13;

＆＃13;

＆＃13;