switchery按鈕的使用方法
1.先引入switchery.css 和 switchery.js
2.繪制 checkbox按鈕 : a.靜態(tài)頁(yè)面寫法 未選中時(shí) <input type="checkbox" class="js-switch_3" /> 選中時(shí) <input type="checkbox" class="js-switch_4" checked />
b.C# 寫法 (1) @Html.CheckBoxFor(m => m.Active, new { @Class = "js-switch", @checked = Model.Active }) <span> Activate</span>
(2) @Html.CheckBox("edit_forMave_" + i, new { @class = "js-switch", @checked = true })
3. script 中處理,是按鈕有點(diǎn)擊效果。
當(dāng)頁(yè)面中只有一個(gè)checkbox 時(shí):var elem = document.querySelector(".js-switch") var switchery= new Switchery( elem,{color : '#f8ac59'}).
當(dāng)有多個(gè)時(shí):var elem = document.querySelector(".js-switch")
$.each(funtion (num) { var switchery = new Switchery(this, { color: '#1AB394', className: 'switchery-small' });}) ;
以上這篇switchery按鈕的使用方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
淺談如何使用webpack構(gòu)建多頁(yè)面應(yīng)用
這篇文章主要介紹了淺談如何使用webpack構(gòu)建多頁(yè)面應(yīng)用,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-05-05關(guān)于window.pageYOffset和document.documentElement.scrollTop
window.pageYOffset:Netscape屬性,指的是滾動(dòng)條頂部到網(wǎng)頁(yè)頂部的距離2011-04-04CheckBox多選取值及判斷CheckBox選中是否為空的實(shí)例
下面小編就為大家?guī)?lái)一篇CheckBox多選取值及判斷CheckBox選中是否為空的實(shí)例。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10兼容多瀏覽器的iframe自適應(yīng)高度(ie8 、谷歌瀏覽器4.0和 firefox3.5.3)
iframe在ie8 、谷歌瀏覽器4.0和 firefox3.5.3均成功自適應(yīng)高度.2009-11-11JavaScript返回網(wǎng)頁(yè)中超鏈接數(shù)量的方法
這篇文章主要介紹了JavaScript返回網(wǎng)頁(yè)中超鏈接數(shù)量的方法,使用javascript中的document.links實(shí)現(xiàn)這一功能,需要的朋友可以參考下2015-04-04javascript 實(shí)現(xiàn)的多瀏覽器支持的貪吃蛇webgame
兼容FF IE的javascript版貪吃蛇游戲,非常厲害的高手。2008-01-01