layui radio 选择事件
时间: 2024-10-23 11:10:33 浏览: 88
在layui中,radio是单选按钮组的一种控件,可以用于让用户做出单一的选择。当用户点击其中一个radio按钮时,会触发选择事件。以下是设置和监听radio选择事件的基本步骤:
1. **创建Radio组**:
在HTML中,创建一个包含多个`<input type="radio">`的radio组,给每个radio添加一个唯一的name属性,然后关联到一个lay-radio标签上:
```html
<input type="radio" name="radioGroup" value="option1">
<label lay-text="Option 1"></label><br>
<!-- 添加更多选项 -->
```
`lay-text`属性用于设置显示的文字,可以根据需要自定义。
2. **启用事件**:
在JavaScript中,使用layui的`event()`方法监听radio的选择事件:
```javascript
layui.use(['layer', 'form'], function(){
var form = layui.form;
form.on('radio(radioGroup)', function(e){
var value = e.elem.val(); // 获取当前选中的值
console.log('Radio选中了:', value); // 打印选中值
// 在这里可以执行其他业务逻辑
});
});
```
当用户点击任一radio时,会触发该回调函数,`e`对象包含了事件的相关信息。
阅读全文