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

相关推荐
宁渡AI大模型3 分钟前
AI 全栈面试新趋势:Vibe Coding、前端、Java 后端高频面试题深度解析|河南宁渡科技有限公司编程教程
java·javascript·人工智能·python·ai大模型
东风微鸣21 分钟前
AI依赖更新别裸奔🚨
javascript
掘金挖土27 分钟前
前端手摸手跑路之 AI 应用开发(六)
前端·后端
liuyt202229 分钟前
【javaweb】day4
前端
研☆香37 分钟前
echarts图表的使用方法
javascript
志尊宝43 分钟前
Vue3 零基础每日笔记(024):组件的创建与使用——从 import 到自动导入
前端·vue.js·笔记·前端框架·html5
@PHARAOH1 小时前
WHAT - 从前端组件化思维到后端架构设计入门
前端·微服务·架构
是立不是利2 小时前
大文件导致请求被拒的连锁反应
开发语言·前端·javascript
志尊宝2 小时前
Vue3 零基础每日笔记(026):emit 子传父——defineEmits 与事件校验
前端·javascript·html·vue3
风骏时光牛马2 小时前
6个高频实用技术脚本案例,覆盖运维与办公自动化(可直接复用)
前端