我正在尝试在html中使用带有以下代码的bootstrap开关,
<input type="checkbox" id="queue_status" checked class="make-switch" data-size="small" data-off-text="Disable" data-on-text="Enable" checked data-on-color="success" data-off-color="warning">
但这会返回&#39; true&#39;或者&#39; false&#39;作为价值,
我们如何才能将自定义价值作为选择?与上面的开关选择一样启用或禁用?
答案 0 :(得分:0)
您可以通过稍加改动(注意 - 它可能导致副作用)来调整bootstrap-switch插件(我使用的v3.3.2):
发件人:强>
$.fn.bootstrapSwitch = function() {
var args, option, ret;
option = arguments[0], args = 2 <= arguments.length ? slice.call(arguments, 1) : [];
ret = this;
this.each(function() {
var $this, data;
$this = $(this);
data = $this.data("bootstrap-switch");
if (!data) {
$this.data("bootstrap-switch", data = new BootstrapSwitch(this, option));
}
if (typeof option === "string") {
return ret = data[option].apply(data, args);
}
});
return ret;
};
以强>
$.fn.bootstrapSwitch = function() {
var args, option, ret;
option = arguments[0], args = 2 <= arguments.length ? slice.call(arguments, 1) : [];
ret = this;
this.each(function() {
var $this, data;
$this = $(this);
data = $this.data("bootstrap-switch");
if (!data) {
$this.data("bootstrap-switch", data = new BootstrapSwitch(this, option));
}
if (typeof option === "string") {
//this section was modified (start)!
var temp = data[option].apply(data, args);
return ret = option == 'state' ? data[temp ? 'onText' : 'offText'].apply(data, args) : temp;
//this section was modified (end)!
}
});
return ret;
};
<强>实现:强>
var res = $('#mycheckbox').bootstrapSwitch('state');
//res == 'Enable' or 'Disable'
P.S。如果您只使用它一次,您可以简单地执行此操作(不对插件进行任何更改):
var element = $('#mycheckbox');
var res = element.bootstrapSwitch(element.bootstrapSwitch('state') ? 'onText' : 'offText');