layui中禁用div标签等操作

小二·2024-05-05 12:40

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

不可编辑直接添加属性

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