js 关于input多选

<div onchange="fn()">
        <label><input width="10" type="checkbox" value="a1" />&nbsp;a1</label><br>
        <label><input width="10" type="checkbox" value="a2" />&nbsp;a2</label><br>
        <label><input width="10" type="checkbox" value="a3" />&nbsp;a3</label><br>
        <label><input width="10" type="checkbox" value="a4" />&nbsp;a4</label><br>
</div>
<div class="chex">请选择</div>


<script>
// 获取选中的ipnut  value值
let list = []
   function fn() {
     list = []
      $('input:checkbox:checked').each(function () {
       console.log($(this).val());
       list.push($(this).val())
  });
if(list.length!=0){
   $(".chex").text(list)
  }else{
    $(".chex").text('请选择')
 }
}


// 根据后端数据回显选中input   XXXX为后端返回数据
 $(XXXX.split(",")).each(function (i, e) {
    $("input:checkbox[value='" + e + "']").prop("checked", true);
})


// 取消所有input选中状态
$("input[type='checkbox']").each(function () { this.checked = false; })
</script>