开关式复选框的操作

形如这样的开关是我们在开发过程中可能会看到的复选框类型

<div class="form-group">
  <label for="inputPassword3" class="control-label">民心网窗口开关</label>
  <div class="control-counten">
    <div class="search_checkbox">
      <input type='checkbox' id="switch" class="switch" value="<?php echo $minxinswitch;?>" <?php if($minxinswitch==1) echo 'checked';else echo ''?>>
      <label for='switch'></label>
    </div>
  </div>
</div>

<?php if($minxinswitch==1) echo 'checked';else echo ''?>这一块代码是通过$minxinswitch的值来判断开关状态。

$("#switch").click(function(){
  var minxinswitch = (document.getElementById("switch").checked)? 1:-1;
   $.ajax({
     type        : 'POST',
     data        : {
     minxinswitch   :minxinswitch
     },
     dataType : 'json',
     url : 'reservation_do.php?act=minxinswitch_change',
     success : function(data){
     if(minxinswitch == 1){
       window.location.href = "reservation_list.php?minxinswitch=1";
     }
     else
       window.location.href = "reservation_list.php?minxinswitch=-1";
     }
   });
});

这里是这里是判断开关的状态,如果是1则是打开,如果是-1则是关闭,开关打开则进入打开页面("reservation_list.php?minxinswitch=1"),反之进入关闭页面("reservation_list.php?minxinswitch=-1"),还可以通过ajax将开关状态提交到数据库中。

当然了,这是要建立在页面获取$minxinswitch值的基础之上

$minxinswitch = 1;//默认值是1
if(isset($_GET['minxinswitch'])){
    $minxinswitch = safeCheck($_GET['minxinswitch']);
}

这样,一个开关就完成了。

原文地址:https://www.cnblogs.com/xlzfdddd/p/9548044.html