首页>>表单>>自定义的checkboxo多选，三个值，包括一个null(2019-05-06)

自定义的checkboxo多选，三个值，包括一个null

自定义的checkboxo多选，三个值，包括一个null
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="form-group">  
  2.         <input id="check-1a" value="1" type="text" data-toggle="checkbox-x" data-size="xs">  
  3.         <input id="check-2a" value="0" data-toggle="checkbox-x" data-size="xs">  
  4.         <input id="check-3a" value="" data-toggle="checkbox-x" data-size="xs">  
  5.     </div>  
  6.       
  7.     <div class="form-group">  
  8.         <input id="check-1b" value="1" data-toggle="checkbox-x" data-size="sm">  
  9.         <input id="check-2b" value="0" data-toggle="checkbox-x" data-size="sm">  
  10.         <input id="check-3b" value="" data-toggle="checkbox-x" data-size="sm">  
  11.     </div>  
  12.       
  13.     <div class="form-group">  
  14.         <input id="check-1c" value="1" data-toggle="checkbox-x" data-size="md">  
  15.         <input id="check-2c" value="0" data-toggle="checkbox-x" data-size="md">  
  16.         <input id="check-3c" value="" data-toggle="checkbox-x" data-size="md">  
  17.     </div>  
  18.       
  19.     <div class="form-group">  
  20.         <input id="check-1d" value="1" data-toggle="checkbox-x" data-size="lg">  
  21.         <input id="check-2d" value="0" data-toggle="checkbox-x" data-size="lg">  
  22.         <input id="check-3d" value="" data-toggle="checkbox-x" data-size="lg">  
  23.     </div>  
  24.       
  25.     <div class="form-group">  
  26.         <input id="check-1e" value="1" data-toggle="checkbox-x" data-size="xl">  
  27.         <input id="check-2e" value="0" data-toggle="checkbox-x" data-size="xl">  
  28.         <input id="check-3e" value="" data-toggle="checkbox-x" data-size="xl">  
  29.     </div>  

 

JavaScript Code
  1. <script>  
  2.         $(document).on('ready', function() {  
  3.             var $el = $("#check-301"), kvInitCbx = function() {  
  4.                 $el.checkboxX({  
  5.                     enclosedLabel: true  
  6.                 });  
  7.             };  
  8.             kvInitCbx();  
  9.             $('.btn-destroy').on('click', function() {  
  10.                 if ($el.data('checkboxX')) {  
  11.                     $el.checkboxX('destroy');  
  12.                 }  
  13.             });  
  14.             $('.btn-recreate').on('click', function() {  
  15.                 if (!$el.data('checkboxX')) {  
  16.                     kvInitCbx();  
  17.                 }  
  18.             });  
  19.         });  
  20.     </script>  

 


原文地址:http://www.freejs.net/article_biaodan_764.html