【Layui】对于input框有时候点击后没有反应

简介: 【Layui】对于input框有时候点击后没有反应

author:咔咔


wechat:fangkangfk


有时候会出现input的无法点击,这个情况是因为这个列表是我使用ajax请求获取的,所以属于未来元素。这个时候就只能使用绑定未来元素进行操作

image.png



在这段代码中,我检测到layui-unselects这个元素的控制样式的,所以使用jquery来判断是否存在layui-from-checked这个class值。


然后进行批量添加,在这个时候引发的问题就是使用自己添加的样式,会一直出现请选择操作数据,这个问题可以看看源码。看了源码就会知道,他们样式虽然是在div中,但是获取的时候是input的checked。


这个时候我们可以看到点击之后input是根本没有checked的,所以我们需要手动操作,下面就是代码  

    // 点击复选框
    $(document).on('click','.layui-unselects',function(){
        var check = $(this).hasClass("layui-form-checked");
        if(check){
            $(this).parent('td').find('input').attr("checked","")
            $(this).removeClass('layui-form-checked')
        }else{
            $(this).parent('td').find('input').attr("checked","checked")
            $(this).addClass('layui-form-checked')
        }
    })
相关文章
|
6月前
input点击后placeholder中的提示消息消失
input点击后placeholder中的提示消息消失
layui内部表单互动的实战案例:根据radio单选框自动改变input内容
layui内部表单互动的实战案例:根据radio单选框自动改变input内容
215 0
|
JavaScript 前端开发
12EasyUI 菜单与按钮- 创建分割按钮(Split Button)
12EasyUI 菜单与按钮- 创建分割按钮(Split Button)
90 0
element-ui时间选择器限制只能点击不让输入(整理)
element-ui时间选择器限制只能点击不让输入(整理)
layui表单select框同时支持下拉和输入的解决方案
layui表单select框同时支持下拉和输入的解决方案
359 0
layui动态上传按钮点击无效
layui动态上传按钮点击无效
292 0
|
JavaScript 数据安全/隐私保护
vue项目实战之点击小眼睛实现input密码框内容显示与隐藏
vue项目实战之点击小眼睛实现input密码框内容显示与隐藏
vue项目实战之点击小眼睛实现input密码框内容显示与隐藏
element中el-radio无法切换点击和input框无法输入的问题(整理)
element中el-radio无法切换点击和input框无法输入的问题(整理)
|
JavaScript PHP 数据库
layui框架实战案例(18):保存草稿和单选radio复选框checkbox无focus属性快速聚焦跳转的解决方案
layui框架实战案例(18):保存草稿和单选radio复选框checkbox无focus属性快速聚焦跳转的解决方案
263 0
|
JavaScript 前端开发
css:隐藏input file标签并触发点击上传文件事件
css:隐藏input file标签并触发点击上传文件事件
603 0
css:隐藏input file标签并触发点击上传文件事件