layui提交表单时获取并提交Checkbox多选框的值

layui2024-09-16270

利用layui库构建一个表单,通过监听submit事件,收集并处理用户选择的多选checkbox数据,展示了在JavaScript中处理用户输入的有效方法。         

<ul class="clearfix">
    <li><input type="checkbox" name="like" lay-skin="primary" value="阅读" title="阅读"></li>
    <li><input type="checkbox" name="like" lay-skin="primary" value="写作" title="写作"></li>
    <li><input type="checkbox" name="like" lay-skin="primary" value="画画" title="画画"></li>
</ul>
<script>
    layui.use('form', function(){
        var form = layui.form;
        //监听提交
        form.on('submit(formDemo)', function(data){
            //获取checkbox[name='like']的值
            var likes = new Array();
            $("input:checkbox[name='like']:checked").each(function(i){
                likes[i] = $(this).val();
            });
            data.field.like = likes.join(",");//将数组合并成字符串
            return false;
        });
    });
</script>