将选择框转换为复选框

Question

我在获取jQuery中的选择框值时遇到了麻烦。我希望复选框值在复选框内更改功能。即：

内

$('input').on('change', function()  //need selection box value here
});

<select class="selectclass" id="id" >
 <option  value="22" >option1</option>   
  <option  value="33" >option21</option> 
</select>

通过像这样的stackoverflow问题，但无法得到我想要的东西

jquery change select to checkbox

等等...

Answer 1

在这里，你可以将select option转换为checkbox上的change

$('select').on('change', function() {
  var val = $(this).val();
  $('<input/>').attr({
  type: 'checkbox',
  value: val
  }).appendTo('#check');
  console.log(val);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="selectclass" id="id">
 <option  value="22" >option1</option>   
  <option  value="33" >option21</option> 
</select>
<div id="check"></div>

或者没有change功能，只需onload

$('select option').each(function() {
  var val = $(this).val();
  $('<input/>').attr({
    type: 'checkbox',
    value: val
  }).appendTo('#check');
})

$('input').on('change', function() {
  alert(this.value);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="selectclass" id="id">
 <option  value="22" >option1</option>   
  <option  value="33" >option21</option> 
</select>
<div id="check"></div>