jquery离线使用使用bootstrap 开关按钮
时间: 2023-07-11 12:25:41 浏览: 121
要在离线环境下使用 jQuery 和 Bootstrap,需要先对应的文件并引入到 HTML 中。可以从官网或者其他镜像站点下载对应版本的 jQuery 和 Bootstrap 的压缩文件,然后将它们解压到本地目录,并引用到 HTML 中。
假设 jQuery 和 Bootstrap 的文件都解压到了 `js` 和 `css` 目录下,可以使用以下代码引用它们:
```html
<!-- 引用 jQuery 库 -->
<script src="js/jquery-3.5.1.min.js"></script>
<!-- 引用 Bootstrap 样式文件 -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- 引用 Bootstrap JavaScript 文件 -->
<script src="js/bootstrap.min.js"></script>
```
完成引用后,可以使用以下代码创建一个开关按钮:
```html
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch1">
<label class="custom-control-label" for="customSwitch1">Toggle switch</label>
</div>
```
同样地,如果需要设置开关按钮的状态,可以使用 jQuery 的 `prop()` 方法,如下所示:
```javascript
$("#customSwitch1").prop("checked", true); // 设置开关按钮为选中状态
$("#customSwitch1").prop("checked", false); // 设置开关按钮为未选中状态
```
通过这种方式,可以在离线环境下使用 jQuery 和 Bootstrap,并方便地创建和控制开关按钮。
阅读全文