bootstrap switch代码示例

以下是 Bootstrap Switch 的代码示例：

HTML代码：

<input type="checkbox" name="my-checkbox" checked>

JavaScript代码：

$(function() {
    $('input[name="my-checkbox"]').bootstrapSwitch({
        onColor: 'success',
        offColor: 'danger',
        onText: 'ON',
        offText: 'OFF'
    });
});

在这个例子中，我们创建了一个带有开关按钮的复选框。当复选框被选中时，按钮颜色将变为 Bootstrap 的成功颜色，并且按钮上的文字将显示为 “ON”。当复选框未被选中时，按钮颜色将变为危险颜色，并且按钮上的文字将显示为 “OFF”。

相关问题

palywright中如何断言bootstrap-switch-container以及bootstrap-switch-label元素按钮的开关

您可以使用JavaScript中的querySelector和querySelectorAll方法来获取页面中的元素，然后使用classList属性来检查或更改元素的状态。

例如，要检查名为“bootstrap-switch-container”的元素是否被选中，您可以使用以下代码：

var container = document.querySelector('.bootstrap-switch-container');
if (container.classList.contains('bootstrap-switch-on')) {
  console.log('The container is on.');
} else {
  console.log('The container is off.');
}

要更改名为“bootstrap-switch-label”的元素的状态，您可以使用以下代码：

var label = document.querySelector('.bootstrap-switch-label');
if (label.classList.contains('bootstrap-switch-on')) {
  label.classList.remove('bootstrap-switch-on');
  label.classList.add('bootstrap-switch-off');
} else {
  label.classList.remove('bootstrap-switch-off');
  label.classList.add('bootstrap-switch-on');
}

请注意，这只是一个示例，并且具体的实现方式可能会因您的具体情况而异。