js 多选框被选中触发的事件,对html表单上的复选框选中或未选中的事件执行操作...

I have a checkbox on a form which is unchecked by default as usual. now I want to perform two separated actions on checked and unchecked state of this checkbox.

this is my checkbox:

syn

and this is my script:

function doalert(id){

if(this.checked) {

alert('checked');

}else{

alert('unchecked');

}

}

it just alerts uncheched!! what is the best way to do that.

解决方案

We can do this using JavaScript, no need of jQuery. Just pass the changed element and let JavaScript handle it.

HTML

syn

JS

function doalert(checkboxElem) {

if (checkboxElem.checked) {

alert ("hi");

} else {

alert ("bye");

}

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,可以使用layui的弹出层和复选框组件来实现这个功能。以下是示例代码: HTML: ```html <button class="layui-btn" id="btn">点击选择</button> ``` JavaScript: ```javascript layui.use(['layer', 'form'], function(){ var layer = layui.layer; var form = layui.form; // 点击按钮弹出层 $('#btn').click(function(){ layer.open({ title: '请选择', content: '<form class="layui-form"><div class="layui-form-item"><div class="layui-input-block"><input type="checkbox" name="options[]" title="选项1"><input type="checkbox" name="options[]" title="选项2"><input type="checkbox" name="options[]" title="选项3"></div></div></form>', btn: ['确定', '取消'], yes: function(index, layero){ // 获取选中的值 var checkedValues = []; $('input[name="options[]"]:checked').each(function(){ checkedValues.push($(this).attr('title')); }); // 返回选中的值 console.log(checkedValues); layer.close(index); }, btn2: function(index, layero){ // 取消按钮的回调函数 layer.close(index); }, success: function(layero, index){ // 渲染表单 form.render(); } }); }); }); ``` 解释一下代码: 1. 引入layer和form模块。 2. 点击按钮后弹出层,层的标题为“请选择”,内容为一个包含多个复选框表单。 3. 确定按钮点击后,获取选中复选框的值,并将其打印到控制台。同时关闭层。 4. 取消按钮点击后,关闭层。 5. 在弹出层成功渲染后,调用form.render()方法进行渲染,使得表单组件能够正常工作。 希望这个示例能够帮助到你。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值