关于layui的复选框监听

提问 已结
29 417
时光笑我是废人
悬赏:20飞吻
版本:layui 浏览器:
今天使用layui的时候 发现复选框的监听和之前好像有点不一样,然后一直无法监听,有哪个好心人帮下我的忙吗
<td>
<foreach name="type" item="val">
<input type="checkbox" name="type[]" title="{$val}" value="{$val}" id="name" >
</foreach>
</td>
上面是html的代码,要怎样写才能监听呢
回帖
  • 这个是简易的完整例子,你看一下
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>layui在线调试</title>
    <link rel="stylesheet" href="//res.layui.com/layui/dist/css/layui.css?t=1512448059660" media="all">
    <style>
    body{margin: 10px;}
    .demo-carousel{height: 200px; line-height: 200px; text-align: center;}
    </style>
    </head>
    <body>
    <div class="layui-form">
    <input type="checkbox" name="like[write]" title="写作" lay-filter="test">
    </div>

    <script src="//res.layui.com/layui/dist/layui.js?t=1512448059660"></script>
    <script>
    layui.use(['element','form'],function(){
    var form=layui.form;
    form.on('checkbox(test)',function(data){
    alert("1");
    })
    });
    </script>

    </body>
    </html>
    0 回复
  • <input id="" type="checkbox" name="like-all" lay-filter="allselect" lay-skin="primary" value="">
    添加lay-filte才能监听
    0 回复
  • @我是个人才 那jq代码那块要怎么写呢 前端玩的不好 layui刚用不久
    0 回复
  • @我是个人才 我看了下官方文档 好像跟平常的用法不一样
    0 回复
  • <div class="layui-form">
    <input type="checkbox" name="like[write]" title="写作" lay-filter="test">
    </div>

    layui.use('form', function(){
    var form = layui.form;
    form.on('checkbox(test)', function(data){
    layer.msg("你点了我一下");
    });
    });
    0 回复
  • form.on('checkbox(filter)', function(data){
    console.log(data.elem); //得到checkbox原始DOM对象
    console.log(data.elem.checked); //是否被选中,true或者false
    console.log(data.value); //复选框value值,也可以通过data.elem.value得到
    console.log(data.othis); //得到美化后的DOM对象
    });
    0 回复
  • @人应该在 不行诶 不知道为啥诶 好焦灼
    0 回复
  • @守护者_咖啡 这个 这个 这个 我能不能说 我不是很会用。。。。。。
    0 回复
  • @时光笑我是废人 如果用的是layui重新渲染后的CheckBox。容器需要添加layui-form属性。如果不是用layui重新渲染的,用原生的监听方法即可
    0 回复
  • 0 回复
  • @人应该在 报的是form.on 为空 我是不是少了什么
    0 回复
  • @时光笑我是废人 你首先看看控制台,有没有报错吧,确定input的lay-filter和form那里是一样的,那么就不会有问题。
    0 回复
  • @人应该在 应该是渲染了
        layui.use('form', function(){
    var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功
    //但是,如果你的HTML是动态生成的,自动渲染就会失效
    //因此你需要在相应的地方,执行下述方法来手动渲染,跟这类似的还有 element.init();
    // form.render();
    });
    我不加载这个就没有
    0 回复
  • @时光笑我是废人 有没有引入layui.js。引入之后需要声明
    layui.use('form', function(){
    //先声明
    var form = layui.form;
    //后调用
    form.on('checkbox(test)', function(data){
    layer.msg("你点了我一下");
    });
    });
    0 回复
  • 那就是没引入form
    0 回复
  • @守护者_咖啡 一样的呀
    0 回复
  • @人应该在
     layui.use('form', function(){
    var form = layui.form;
    form.on('checkbox(type)', function(data){
    layer.msg("你点了我一下");
    });
    });
    我照着你写的呀
    0 回复
  • @守护者_咖啡 啊?酱紫啊,之前用的layer 没接触layui 这块 很不熟悉
    0 回复
  • @人应该在 layui.js 不引进的话 会报很多错的
    0 回复
  • @时光笑我是废人 你的layui版本是多少,这个有没有引入进去。
    0 回复
  • @人应该在 Uncaught TypeError: form.on is not a function
    0 回复
  • @守护者_咖啡 layui-v1.0.9_rls
    0 回复
  • @守护者_咖啡 版本问题..我去 还有一个layui2 我应该用layui2的 谢谢了
    0 回复
  • @人应该在 谢谢你 我找到问题了 是版本问题来的
    0 回复
  • @守护者_咖啡 抱歉,我不能采纳你,那个好心人帮了我这么多。虽然是你提醒了我。真的谢谢。
    0 回复
  • EIT王子
    2017-12-6
    @人应该在 问一下。。Form里边所有的方法都会触发submit提交,如果不返回false就会去加载那个页面。其实只是一个处理而已。。。这种怎么办呢?
    0 回复
  • @EIT王子 你说的是按钮触发submit提交吗?如果是的话,在按钮上加上type=“button”
    0 回复
  • @时光笑我是废人 我知道了。layui旧版本的form声明是layui.form()。我们给你的写法是新版本的写法,去掉了form后面的括号
    0 回复
  • 0 回复