我的假设是,如果我禁用了一个div,所有的内容也都禁用了。

然而,内容是灰色的,但我仍然可以与它互动。

有办法做到吗?(禁用一个div,让所有的内容也禁用)


当前回答

这里有一个快速的评论给那些不需要div而只需要blockelement的人。在HTML5中<fieldset disabled="disabled"></fieldset>得到了disabled属性。禁用字段集中的每个表单元素都是禁用的。

其他回答

有一些可配置的javascript库可以接收html字符串或dom元素,并去掉不需要的标签和属性。这些被称为html杀菌剂。例如:

DOMPurify 疯狂的 sanitize-html

例如,在DOMPurify中

DOMPurify.sanitize('<div>abc<iframe//src=jAva&Tab;script:alert(3)>def</div>'); 
// becomes <div>abcdef</div>

使用JQuery这样的框架来做以下事情:

function toggleStatus() {
    if ($('#toggleElement').is(':checked')) {
        $('#idOfTheDIV :input').attr('disabled', true);
    } else {
        $('#idOfTheDIV :input').removeAttr('disabled');
    }   
}

禁用和启用输入元素在一个Div块使用jQuery应该帮助你!

从jQuery 1.6开始,禁用功能应该使用。prop而不是。attr。

正如评论中提到的,您仍然可以通过使用tab键在元素之间导航来访问元素。所以我推荐这个:

$("#mydiv")
  .css({"pointer-events" : "none" , "opacity" :  "0.4"})
  .attr("tabindex" , "-1");

我想我得插几句话。

< div >可以在IE8/9中被禁用。我认为这是“不正确的”,这让我感到困惑 不要使用. removeprop(),因为它对元素有永久的影响。使用.prop("disabled", false)代替 $ (" # myDiv”).filter(“输入、文本区域、选择按钮”)。Prop ("disabled", true)更显式,它将捕获一些您在:input中遗漏的表单元素

如果你想禁用指针事件,它很容易处理

document.getElementById("appliedDatepicker").style.pointerEvents = "none";

or

如果你想启用,

document.getElementById("appliedDatepicker").style.pointerEvents = "auto";