How to disable all div content
Many of the above answers only work on form elements. A simple way to disable any DIV including its contents is to just disable mouse interaction. For example:
$("#mydiv").addClass("disabledbutton");
CSS
.disabledbutton {
pointer-events: none;
opacity: 0.4;
}
Supplement:
Many commented like these: "This will only disallow mouse events, but the control is still enabled" and "you can still navigate by keyboard". You Could add this code to your script and inputs can't be reached in other ways like keyboard tab. You could change this code to fit your needs.
$([Parent Container]).find('input').each(function () {
$(this).attr('disabled', 'disabled');
});
how to disable DIV element and everything inside
Try this!
$("#test *").attr("disabled", "disabled").off('click');
I don't see you using jquery above, but you have it listed as a tag.
Enable & Disable a Div and its elements in Javascript
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;
}
disable all form elements inside div
Try using the :input
selector, along with a parent selector:
$("#parent-selector :input").attr("disabled", true);
How to disable & enable all contents of a Div
try this
$('#EditorRows').find('a').each(function(){
$(this).replaceWith($(this).text());
});
Update
To disable :
$('#EditorRows').find('a').bind('click', false);
To enable :
$('#EditorRows').find('a').unbind('click', false);
Related Topics
Restricting Input to Textbox: Allowing Only Numbers and Decimal Point
How to Draw an Inline Svg (In Dom) to a Canvas
How to Run an .Exe or .Bat File on 'Onclick' in Html
How to Make a Browser to Browser (Peer to Peer) Connection
Should I Write Script in the Body or the Head of the Html
Do You Need Text/JavaScript Specified in Your ≪Script≫ Tags
Html/JavaScript: How to Access Json Data Loaded in a Script Tag With Src Set
What Is Offsetheight, Clientheight, Scrollheight
Addeventlistener("Click",...) Firing Immediately
How to Prevent Iframe from Redirecting Top-Level Window
How to Clear an HTML File Input With JavaScript
Performance of Mutationobserver to Detect Nodes in Entire Dom
Return HTML Content as a String, Given Url. JavaScript Function
User Recognition Without Cookies or Local Storage
How to Validate an Email Address in JavaScript
Onchange Event Handler for Radio Button (Input Type="Radio") Doesn't Work as One Value