如何在jQuery中选择另一个选择框时在一个选择框中显示逗号分隔值

x33g5p2x  于 2023-05-17  发布在  jQuery
关注(0)|答案(1)|浏览(85)

我有一个像下面这样的selectbox,当这个选择框被选中时,dataprice中的值被插入到一个输入文本框中,

$('.selectProduct1').on('change', function() {
  $('.regularPrice1')
    .val(
      $(this).find(':selected').data('price1')
    );

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="form-control select selectProduct1" name="university1" id="university1">

  <option>Select </option>

  <option data-price1="123" data-price2="c1,c2,c3,c4" value="Test 1">Test 1</option>
  <option data-price1="456" data-price2="c1,c2,c3,c4" value="test 2">Test 2</option>

</select>

<input type="number" name="fee1" id="fee1" value="" class="form-control regularPrice1">

这是工作正常,现在我想逗号分隔值内的选择选项显示在另一个selectbox,是可能的吗?先谢谢你了

dvtswwa3

dvtswwa31#

$('#university1').on('change', function() {
      $('#fee1').val($("#university1 option:selected").data('price1'));
      var Price2val=$("#university1 option:selected").data('price2');
      var arr = Price2val.split(',');
      $('#selectProduct2').html('<option seleted disabled>select</option>');
      jQuery.each(arr, function(index, item) {
        $('#selectProduct2').append('<option value="'+item+'">'+item+'</option>');
      });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="form-control select selectProduct1" name="university1" id="university1">
  <option selected disabled>Select </option>
  <option data-price1="123" data-price2="c1,c2,c3,c4" value="Test 1">Test 1</option>
  <option data-price1="456" data-price2="c1,c2,c3,c4,c5" value="test 2">Test 2</option>
</select>
<input type="number" name="fee1" id="fee1" value="" class="form-control regularPrice1">
<select class="form-control select selectProduct2" name="selectProduct2" id="selectProduct2">
   <option selected disabled>Select </option>
</select>

请尝试此代码。

相关问题