I am looking for a method to Enable and Disable the div id="dcalc" and Its children.
<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>
I want to Disable them at loading the page and then by a click i can enable them ?
This is what i have tried
document.getElementById("dcalc").disabled = true;
You should be able to set these via the attr()
or prop()
functions in jQuery as shown below:
jQuery (< 1.7):
// This will disable just the div
$("#dcacl").attr('disabled','disabled');
or
// This will disable everything contained in the div
$("#dcacl").children().attr("disabled","disabled");
jQuery (>= 1.7):
// This will disable just the div
$("#dcacl").prop('disabled',true);
or
// This will disable everything contained in the div
$("#dcacl").children().prop('disabled',true);
or
// disable ALL descendants of the DIV
$("#dcacl *").prop('disabled',true);
Javascript:
// This will disable just the div
document.getElementById("dcalc").disabled = true;
or
// 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;
}