layui-checkbox用法

layui checkbox用法

Layui 是一个简单易用、灵活的前端框架，它提供了丰富的组件和功能。下面是 Layui 中 Checkbox（复选框）的用法：

1. 引入 Layui 的 CSS 和 JS 文件：

```html

```

2. 创建 Checkbox：

```html

```

- `name` 属性：用于标识 Checkbox，可以在表单提交时使用。 - `title` 属性：复选框的显示文本。

- `lay-skin` 属性：指定复选框的外观样式，这里使用 \"primary\" 表示基本样式。

3. 使用 Checkbox 的值：

你可以通过 JavaScript 获取 Checkbox 的值，以下是一个示例：

```javascript

layui.use(['form'], function() { var form = layui.form;

// 监听提交按钮点击事件

form.on('submit(submitBtn)', function(data){ var checkedValues = [];

$('input:checkbox[name=\"like[write]\"]:checked').each(function(){

checkedValues.push($(this).val()); });

console.log(checkedValues); return false; // 阻止表单提交 }); }); ```

这里使用 `form.on` 监听提交按钮的点击事件，并通过选择器获取被选中的 Checkbox 值。

注意：以上代码只是一个简单的示例，你可以根据具体的需求进行定制和扩展。另外，为了使 Checkbox 生效，需要引入并初始化 Layui 的 form 模块，例如 `layui.use(['form'], function() { ... });`。