layui中禁用div标签等操作

为了实现点击表格行后触发事件 然后去触发后进行操作 页面流程操作设置规定

不可编辑直接添加属性

复制代码
class="layui-disabled"

如果在最大的 div 设置不可编辑 但是内部有些还是可以触发使用的 所以就重写一下

取到当前 div 下的 所有的子元素 然后在给所有的子元素 都禁用了

实现代码 :

复制代码
 var tableDiv1 = $('.tablediv1');

            tableDiv1.on('mouseover mouseout click', function(event) {
                if (event.type === 'mouseover') {
                    // 添加覆盖层和禁用元素
                    tableDiv1.css("position", "relative").append("<div class='overlay'></div>");
                    tableDiv1.find('*').each(function(){
                        $(this).prop('disabled', true).addClass('disabled-element');
                    });

                } else if (event.type === 'mouseout') {
                    // 移除覆盖层并启用元素
                    tableDiv1.find('.overlay').remove();
                    tableDiv1.find('*').each(function(){
                        $(this).prop('disabled', false).removeClass('disabled-element');
                    });
                } else if (event.type === 'click') {
                    console.log('鼠标点击事件')
                }
            });

我这个是用的 鼠标事件触发的 可自行更改

如果一样是使用鼠标的 看看这个文章 也是 在弄这个时候走的 误区 忘记了 框架影响结构了

js、jq 操作 可以看看

js、鼠标操作事件https://blog.csdn.net/weixin_52208686/article/details/138311397

相关推荐
kyriewen6 小时前
别再 console.log 了:5 个 Chrome DevTools 调试技巧,用过就回不去了
前端·javascript·面试
IT_陈寒8 小时前
Python搞不定字符串编码?这破玩意坑我两小时!
前端·人工智能·后端
To_OC8 小时前
LC 1 两数之和:面试第一道必考题,暴力解法直接被面试官 pass
javascript·算法·leetcode
DigitalOcean9 小时前
Laravel 开发者已在 DigitalOcean 上开通超过 10 万台服务器
前端·laravel
星始流年9 小时前
从 Tool 到 Skill——基于 LangChain 的服务端Skill实现
前端·langchain·agent
李惟9 小时前
开源本地通信库,纯客户端 RPC,像聊天一样通信
前端
YAwu119 小时前
深入解析 React 炫彩鼠标跟随标题组件:从坐标定位到动画性能
前端·react.js
GuWenyue9 小时前
排序效率低?5分钟吃透快速排序,性能飙升至O(nlogn)
前端·javascript·面试
OpenTiny社区9 小时前
🎨 看完 GenUI SDK 源码我悟了!
前端·vue.js·github
叁两9 小时前
前端转型AI Agent该如何学习?(前置篇)
前端·人工智能·node.js