欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

bootstrap switch開關(guān)組件使用方法詳解

 更新時間：2017年08月22日 09:20:52   作者：javanbme  
這篇文章主要為大家詳細(xì)介紹了bootstrap switch開關(guān)組件的使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下

bootstrap中文網(wǎng)上有這么一個bootstrap-switch組件，很實用，看demo學(xué)習(xí)并記錄一下。

<!DOCTYPE html> 
<html> 
  <head> 
    <meta charset=utf-8> 
    <meta name=description content=""> 
    <meta name=viewport content="width=device-width, initial-scale=1"> 
    <title></title> 
    <link href="css/bootstrap.min.css" rel="external nofollow" rel="stylesheet" /> 
    <link href="css/bootstrap-switch.min.css" rel="external nofollow" rel="stylesheet" /> 
     <script src="js/jquery/jquery.1.11.3.min.js"></script> 
     <script src="js/bootstrap.min.js"></script> 
    <script src="js/bootstrap-switch.min.js"></script> 
 
  </head> 
  <body> 
     <input name="status" type="checkbox" data-size="small">  
     <script type="text/javascript"> 
      $('[name="status"]').bootstrapSwitch({  
      onText:"啟動",  
      offText:"停止",  
      onColor:"success",  
      offColor:"info",  
      size:"small",  
    onSwitchChange:function(event,state){  
      if(state==true){  
        alert('已打開');  
      }else{  
        alert('已關(guān)閉');  
      }  
    }  
 
       })  
 
    </script> 
  </body> 
</html>

Bootstrap-Switch源碼地址：https://github.com/nostalgiaz/bootstrap-switch

Bootstrap-Switch文檔以及Demo：http://www.bootstrap-switch.org/examples.html

常用的屬性

size：開關(guān)大小?？蛇x值有'mini', 'small', 'normal', 'large'
onColor：開關(guān)中開按鈕的顏色?？蛇x值有'primary', 'info', 'success', 'warning', 'danger', 'default'
offColor：開關(guān)中關(guān)按鈕的顏色?？蛇x值'primary', 'info', 'success', 'warning', 'danger', 'default'
onText：開關(guān)中開按鈕的文本，默認(rèn)是“ON”。
offText：開關(guān)中關(guān)按鈕的文本，默認(rèn)是“OFF”。
onInit：初始化組件的事件。
onSwitchChange：開關(guān)變化時的事件。

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論