Question

我正在寻找启用和禁用的方法 div id =“dcalc”及其子女。

<div id="dcalc" class="nerkheArz"
 style="left: 50px; top: 150px; width: 380px; height: 370px;
 background: #CDF; text-align: center" >
 <div class="nerkh-Arz"></div>
 <div id="calc"> </div>
</div>

我想在加载页面时禁用它们，然后点击一下我可以启用它们吗？

这就是我试过的

document.getElementById("dcalc").disabled = true;

Answer 1

您应该可以通过jQuery中的attr()或prop()函数设置这些函数，如下所示：

jQuery（＆lt; 1.7）：

// This will disable just the div
$("#dcacl").attr('disabled','disabled');

或

// This will disable everything contained in the div
$("#dcacl").children().attr("disabled","disabled");

jQuery（＆gt; = 1.7）：

// This will disable just the div
$("#dcacl").prop('disabled',true);

或

// This will disable everything contained in the div
$("#dcacl").children().prop('disabled',true);

或

//  disable ALL descendants of the DIV
$("#dcacl *").prop('disabled',true);

<强>使用Javascript：

// This will disable just the div
document.getElementById("dcalc").disabled = true;

或

// This will disable all the children of the div
var nodes = document.getElementById("dcalc").getElementsByTagName('*');
for(var i = 0; i < nodes.length; i++){
     nodes[i].disabled = true;
}

Answer 2

如果要禁用所有div的控件，可以尝试在div上添加透明div以禁用，您将使其无法点击，也可以使用fadeTo创建禁用外观。

试试这个。

$('#DisableDiv').fadeTo('slow',.6);
$('#DisableDiv').append('<div style="position: absolute;top:0;left:0;width: 100%;height:100%;z-index:2;opacity:0.4;filter: alpha(opacity = 50)"></div>');

Answer 3

以下选择所有后代元素并禁用它们：

$("#dcacl").find("*").prop("disabled", true);

但是禁用某些元素类型才真正有意义：输入，按钮等，所以你想要一个更具体的选择器：

$("#dcac1").find(":input").prop("disabled",true);
// noting that ":input" gives you the equivalent of
$("#dcac1").find("input,select,textarea,button").prop("disabled",true);

要重新启用，只需将“禁用”设置为false。

我想在加载页面时禁用它们，然后点击一下即可启用它们

好的，所以将上面的代码放在文档就绪处理程序中，并设置一个合适的点击处理程序：

$(document).ready(function() {
    var $dcac1kids = $("#dcac1").find(":input");
    $dcac1kids.prop("disabled",true);

    // not sure what you want to click on to re-enable
    $("selector for whatever you want to click").one("click",function() {
       $dcac1kids.prop("disabled",false);
    }
}

我已经缓存了选择器的结果，假设您没有在页面加载和点击之间向div添加更多元素。我已经使用.one()附加了点击处理程序，因为您没有指定重新禁用元素的要求，因此可能只需要处理一次事件。当然，如果合适，您可以将.one()更改为.click()。

启用＆amp;在Javascript中禁用Div及其元素

3 个答案: