.btn { display:inline-block; padding:6px 12px; margin-bottom:0; font-size:14px; font-weight:normal; line-height:1.42857143; text-align:center; white-space:nowrap; vertical-align:middle; -ms-touch-action:manipulation; touch-action:manipulation; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; background-image:none; border:1px solid transparent; border-radius:4px; } .btn-primary { color:#fff; background-color:#337ab7; border-color:#2e6da4; } .btn-primary:focus,.btn-primary.focus { color:#fff; background-color:#286090; border-color:#122b40; } .btn-primary:hover { color:#fff; background-color:#286090; border-color:#204d74; } .btn.disabled,.btn[disabled] { cursor:not-allowed; filter:alpha(opacity=65); -webkit-box-shadow:none; box-shadow:none; opacity:.65; } a.btn.disabled { pointer-events:none; } input[type=checkbox] { display:inline-block; width:20px; height:20px; line-height:20px; vertical-align:middle; margin:0 4px; }
前者为判断切换的方法,返回true则取消禁用效果,反之禁用按钮.
后者为click要执行的方法. 如果从第2个函数开始有多个执行函数,则默认根据选择器顺序对应匹配,如果只有一个,则选择器对应按钮都执行同一个操作. 同时请注意,此方法中的disabled类取自bootstrap,或者可以自定义此类样式(本页已摘录),且后面的所有回调方法请使用匿名函数传入,否则可能函数内容this指向错误.
用法参照上例.