layui复选框限制选择个数的方法

复选框限制选择个数的方法

html

<div class="layui-form-item">
  <label class="layui-form-label">xxx</label>
  <div class="layui-input-block">
    <input class="education" lay-filter="hope" type="checkbox" name="param[hope_employ][]" value="yy" title="xx">
  </div>
</div>

js

form.on('checkbox(hope)',function(data){
  console.debug(data);
  var len=$(".education:checked").length;
  if(len>3){
    $(data.elem).next().attr("class","layui-unselect layui-form-checkbox");
    $(data.elem).prop("checked",false);
    layer.msg('最多只能选3项！',{icon:5});
    return false;
  }
});

以上这篇layui复选框限制选择个数的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • layui复选框的全选与取消实现方法

    废话不多说啦,直接贴上代码吧!   <div class="layui-form-item layui-form-text">             <label class="layui-form-label">                 <span class="x-red">*</span>权限表             </label>             <d

  • layui表格数据复选框回显设置方法

    layui2.3版本,本身并不带有复选框回显功能,那么需要从源头解决此事,F12代码调试,找到与复选框关联的地方发现: 我们只需要在渲染数据回调时找到每个复选框根据数据的不同来设置回显. layui这里有一个坑,设置class属性后会造成二次点击效果,千万不要手动修改class属性,那么应该怎么办呢? 每次**点击**其中一个复选框时都会增加一个class属性,第二次点击又会给删除: table.render({ elem: '#LAY_table_topic', url: '/admin/to

  • layui-table表复选框勾选的所有行数据获取的例子

    项目需求,可以用复选框勾选项目进行提交,如下表 <table class="layui-table" lay-data="{url:'******', id:'test3'}" lay-filter="test3"> <thead> <tr> <th lay-data="{type:'checkbox'}">ID</th> <th lay-data="

  • 解决layui 复选框等内置控件不显示的问题

    将复选框的代码原封不动地粘上后居然不显示 需要加入下列代码,监听form,才会显示控件 <script> layui.use('form', function () { var form = layui.form; }); </script> tab也是一样的原理,显示tab需要加上 <script> // tab控件必须有下面的代码,才可以切换 layui.use('element', function () { var element = layui.element

  • layui 监听表格复选框选中值的方法

    需要达到的目的: ajax()异步请求后台时,需要传入表格里复选框选中的id值 注意:在渲染form on 方法的done里面加入 done:function(res){ table_data=res.data; } 将复选框选中的值的id加入数组中,然后传递到后台作为ids参数 //自定义数组 var table_data=new Array(); var ids =new Array(); table.on('checkbox(push_port_table)', function(obj)

  • layui从数据库中获取复选框的值并默认选中方法

    如下: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" type="text/css" href="../../../static/js/css/layui.css" rel=

  • 解决Layui选择全部,换页checkbox复选框重新勾选的问题方法

    在项目中发现layui数据表格勾选复选框checkbox的时候,转到新的一页勾选,上一次的勾选不会选中,即没有记忆功能.导致跟后台交互传递参数不全问题. 为了解决此问题,我们可以借助缓存,每勾选一个,保存到缓存变量数组中,取消勾选的时候,删除缓存的对应项. <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <

  • layui复选框限制选择个数的方法

    复选框限制选择个数的方法 html <div class="layui-form-item"> <label class="layui-form-label">xxx</label> <div class="layui-input-block"> <input class="education" lay-filter="hope" type="

  • JavaScript限定复选框的选择个数示例代码

    有10个复选框,用户最多只能勾选3个,否则就灰掉所有复选框. (用户再次勾掉复选框时,仍然可以再次选择.) 将可变的部分设置为JS的参数,以实现代码复用. JS代码 第一个参数为复选框的name,第二个参数为最多允许的勾选值. 复制代码 代码如下: function choicetest(name,num){ var choicearr = document.getElementsByName(name); var a=0; for(var i=0;i<choicearr.length;i++)

  • js 实现复选框只能选择一项的示例代码

    实例如下所示: <!DOCTYPE HTML> <html> <head> <title></title> </head> <body> <ul> <li><input type="checkbox" name="ss" onclick="choose(this)">1</li> <li><inpu

  • 限制复选框最多选择项的实现代码

    在一个招聘网站中,通过限制用户选择职位标签个数,可以精确定位用户的职位.例如,以复选框的形式为用户提供一下备选职位标签,限制用户最多选择3个,当超过三个时禁止用户继续选择. 复选框在问卷调查,招聘网站用的很广,今天来介绍一下限制复选框最多选择几项的方法: 思路: 监听复选框的onclick事件 checkbox.onclick = function(){ //代码块 } 监听复选框的checked属性: if(chckbox.checked){ //代码块 } HTML代码: < input t

  • jQuery实现复选框批量选择与反选的方法

    本文实例讲述了jQuery实现复选框批量选择与反选的方法.分享给大家供大家参考.具体实现方法如下: function selectAll(){ $('input[type|=checkbox]').attr('checked','checked'); } function cancelAll(){ $('input[type|=checkbox]').removeAttr('checked'); } 希望本文所述对大家的jQuery程序设计有所帮助.

  • 基于layui的table插件进行复选框联动功能的实现方法

    实际项目功能: 给员工账号进行分配权限(增加权限,修改权限) 实现思路: 用表格展示权限列表–>勾选分配该账号的权限–>调用接口 出现的问题: 因为某些权限之间是有关联的,比如: " 查看材料 " 和 " 修改材料 " ,这两个权限是有联系的,当你勾选 " 修改材料 " 权限的时候,那么, " 查看材料 " 权限也要勾选上,当你取消勾选 " 查看材料 "权限的时候," 修改材料 &qu

  • JQuery勾选指定name的复选框集合并显示的方法

    本文实例讲述了JQuery勾选指定name的复选框集合并显示的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&qu

  • jquery获取复选框checkbox的值实现方法

    jQuery API : each(callback)::以每一个匹配的元素作为上下文来执行一个函数. :checked :匹配所有选中的被选中元素(复选框.单选框等,不包括select中的option) js: //js获取复选框值 var obj = document.getElementsByName("interest");//选择所有name="interest"的对象,返回数组 var s='';//如果这样定义var s;变量s中会默认被赋个null值

随机推荐