Question

是否可以禁用div和子元素（例如按钮跨度，......），并在其上设置工具提示（例如，此部分已禁用）。

我刚试过：

$(".divclass").css('pointer-events', 'none').css('opacity', '.4').css('filter', 'alpha(opacity=50)');

div和子元素被禁用但我无法提供工具提示，即使标题也不起作用。

Answer 1

如何用叠加层覆盖已禁用的元素？

以下代码创建一个插件，涵盖所有带叠加层的元素。 “title”参数用于为overlay元素提供“title”属性。

$.fn.coverWithOverlay = function(title) {
    return this.each(function() {
        var $element = $(this),
            pos = $element.offset();
        var $overlay = $('<div></div>').attr({
            title: title
        }).css({
            position: 'absolute',
            backgroundColor: 'white',
            opacity: 0.5,
            top: pos.top + 'px',
            left: pos.left + 'px',
            width: $element.outerWidth() + 'px',
            height: $element.outerHeight() + 'px'
        });
        $(document.body).append($overlay);
    });
}

您可以像这样调用插件：

$('.disabled').coverWithOverlay('this is disabled');

Demo on JsFiddle

如果这是您想要使用但又需要更多功能的技术，则可以使用库 - 例如jQuery BlockUI Plugin。

禁用div和子元素，并在其上有工具提示

1 个答案: