Javascript 如何禁用DIV元素和其中的所有内容_Javascript_Jquery_Html_Css

Javascript 如何禁用DIV元素和其中的所有内容

javascript jquery html css

Javascript 如何禁用DIV元素和其中的所有内容,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我需要使用Javascript禁用一个DIV及其所有内容。我可以发誓做一个简单的 <div disabled="true"> 以前为我工作，但由于某种原因，它不再工作了。我不明白为什么在IE10中：“ClickMe”文本没有变灰，ClickHandler仍然有效我真的需要它为IE10工作。下面是我的代码 <html> <script> function disableTest(){ documen

我需要使用Javascript禁用一个DIV及其所有内容。我可以发誓做一个简单的

<div disabled="true">

以前为我工作，但由于某种原因，它不再工作了。我不明白为什么

在IE10中：“ClickMe”文本没有变灰，ClickHandler仍然有效

我真的需要它为IE10工作。下面是我的代码

<html>
    <script>
         function disableTest(){

            document.getElementById("test").disabled = true;
            var nodes = document.getElementById("test").getElementsByTagName('*');
            for(var i = 0; i < nodes.length; i++){
                nodes[i].disabled = true;
            }

         }


     </script>

<body onload="disableTest();">
   <div id="test">
       <div onclick="alert('hello');">
           Click Me
       </div>
   </div>

</body>
</html>


函数禁用测试（）{
document.getElementById（“test”）.disabled=true；
var nodes=document.getElementById（“test”）.getElementsByTagName（'*'）；
对于（var i=0；i

试试这个
$("#test *").attr("disabled", "disabled").off('click');

我看不到您在使用上面的jquery，但您已经将其作为标记列出。
我认为内联脚本很难停止，您可以尝试以下方法：
<div id="test">
    <div>Click Me</div>
</div>

您不能使用“禁用”来禁用单击事件。我不知道它是如何或者是否在IE6-9中工作的，但它在Chrome上不工作，在IE10上也不应该这样工作
您也可以通过附加取消的事件来禁用onclick事件：
;(function () {
    function cancel () { return false; };
    document.getElementById("test").disabled = true;
    var nodes = document.getElementById("test").getElementsByTagName('*');
    console.log(nodes);
    for (var i = 0; i < nodes.length; i++) {
        nodes[i].setAttribute('disabled', true);
        nodes[i].onclick = cancel;
    }
}());

；（功能（）{
函数cancel（）{return false；}；
document.getElementById（“test”）.disabled=true；
var nodes=document.getElementById（“test”）.getElementsByTagName（'*'）；
console.log（节点）；
对于（var i=0；i

此外，直接在节点上设置“disabled”并不一定会添加属性-使用setAttribute会添加属性
以下css语句禁用单击事件
pointer-events:none;

纯javascript无jQuery

函数sah（）{
$（“#div2”）.attr（“禁用”、“禁用”）.off（“单击”）；
var x1=$（“#div2”）.hasClass（“disabledDiv”）；
（x1==true）？$（“#div2”）.removeClass（“disabledDiv”）：$（“#div2”）.addClass（“disabledDiv”）；
sah1（document.getElementById（“div1”））；
}
功能sah1（el）{
试一试{
el.disabled=el.disabled？假：真；
}捕获（E）{}
如果（el.childNodes&&el.childNodes.length>0）{
对于（var x=0；x

#div2{
填充物：5px10px；
背景色：#777；
宽度：150px；
边缘底部：20px；
}
.不可抗力{
指针事件：无；
不透明度：0.4；
}

点击我




男性


女性






我只是想禁用DIV及其处理程序中的所有内容。不！无法禁用div。只有表单和表单元素。“true”
不是禁用的属性（在标记中）的有效值，实际上在怪癖模式下IE可以禁用div
，但它只会使按钮文本变灰，不会阻止事件触发，使用data dissabled
处理非表单元素中的此类内容disabled
不是div
的有效属性。prop（“disabled”，true）
会更好（如果它能工作的话）啊，你应该在原始帖子中指定。在css中创建一个.disabled
类，设置颜色：灰色和背景颜色：rgb（0,0,0,2）
并添加类$（“#测试”）.addClass（“禁用”）
@MaxStrater它不会切换旧的单击绑定，如何再次启用？非常好的一个，但今天有一些不支持它：+10，StackOverflow从未让我失望。不管是过时的IE用户，我警告他们总是升级他们的浏览器。不幸的是，你仍然可以使用Tab键在元素之间导航（一旦你导航到一个元素，你也可以编辑它）。表单字段上的标准disabled
属性处理所有形式的输入，而不仅仅是鼠标。这只解决了禁用鼠标输入的问题。正如@RoyTinker所说，这不会影响表单元素。无论您使用何种逻辑将指针事件：none
添加到您的div中，在该“disabled”中也有所有表单元素，看起来div中也有disabled=true属性。“disabled”对我在Chrome、Mozilla和IE中的divsWorking不起作用。请复制上面的粘贴示例并检查它好吗？@MandeepJain，为了方便起见，我将代码添加到代码段中。运行上面的代码片段。感谢您回复这篇旧文章。但是，只能禁用窗体和窗体元素。您的代码禁用所有输入元素，但不禁用div本身。@MandeepJain我想您想禁用div click事件，对吗？检查上面的代码。现在根据您的要求禁用整个div。告诉我这对你有用与否。
pointer-events:none;