在Javascript中启用和禁用Div及其元素
我正在寻找一种方法来启用和禁用 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; 
	
 您应该可以通过jQuery中的attr()或prop()函数来设置它们,如下所示: 
jQuery(<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(> = 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; } 
如果你想禁用所有div的控件,你可以尝试在div上添加一个透明的div来禁用,你可以使其不可用,也可以使用fadeTo来创build一个禁用的外观。
尝试这个。
 $('#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>'); 
以下select所有后代元素并禁用它们:
 $("#dcacl").find("*").prop("disabled", true); 
但是只有禁用某些元素types才有意义:input,button等,所以你需要一个更具体的select器:
 $("#dcac1").find(":input").prop("disabled",true); // noting that ":input" gives you the equivalent of $("#dcac1").find("input,select,textarea,button").prop("disabled",true); 
要重新启用,只需将“disabled”设置为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); } } 
 我已经caching了select器的结果,假设你没有在页面加载和点击之间添加更多的元素。 我已经附加了.one()的点击处理程序,因为你没有指定要求重新禁用这些元素,所以推测这个事件只需要处理一次。 当然,如果合适,您可以将.one()更改为.one() 。