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

相关推荐
PineappleCoder3 小时前
性能数据别再瞎轮询了!PerformanceObserver 异步捕获 LCP/CLS,不卡主线程
前端·性能优化
PineappleCoder3 小时前
告别字体闪烁 / 首屏卡顿!preload 让关键资源 “高优先级” 提前到
前端·性能优化
m0_471199633 小时前
【vue】通俗详解package-lock文件的作用
前端·javascript·vue.js
GIS之路4 小时前
GDAL 读取KML数据
前端
今天不要写bug4 小时前
vue项目基于vue-cropper实现图片裁剪与图片压缩
前端·javascript·vue.js·typescript
用户47949283569154 小时前
记住这张时间线图,你再也不会乱用 useEffect / useLayoutEffect
前端·react.js
咬人喵喵5 小时前
14 类圣诞核心 SVG 交互方案拆解(附案例 + 资源)
开发语言·前端·javascript
问君能有几多愁~5 小时前
C++ 日志实现
java·前端·c++
咬人喵喵5 小时前
CSS 盒子模型:万物皆是盒子
前端·css