jQuery 禁用div内的所有表单元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5290525/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
disable all form elements inside div
提问by amirash
is there a way to disable all fields (textarea/textfield/option/input/checkbox/submit etc) in a form by telling only the parent div name in jquery/javascript?
有没有办法通过只告诉 jquery/javascript 中的父 div 名称来禁用表单中的所有字段（textarea/textfield/option/input/checkbox/submit 等）？
回答by Andrew Whitaker
回答by Trevor
$('#mydiv').find('input, textarea, button, select').attr('disabled','disabled');
回答by Optimus Prime
回答by Syed Nasir Abbas
$(document).ready(function () {
$('#chkDisableEnableElements').change(function () {
if ($('#chkDisableEnableElements').is(':checked')) {
enableElements($('#divDifferentElements').children());
}
else {
disableElements($('#divDifferentElements').children());
}
});
});
function disableElements(el) {
for (var i = 0; i < el.length; i++) {
el[i].disabled = true;
disableElements(el[i].children);
}
}
function enableElements(el) {
for (var i = 0; i < el.length; i++) {
el[i].disabled = false;
enableElements(el[i].children);
}
}
回答by Samir Rahimy
Simply this line of code will disable all input elements
只需这行代码将禁用所有输入元素
$('#yourdiv *').prop('disabled', true);
回答by ????
How about achieving this using only HTML attribute 'disabled'
如何仅使用 HTML 属性“禁用”来实现这一点
<form>
<fieldset disabled>
<div class="row">
<input type="text" placeholder="">
<textarea></textarea>
<select></select>
</div>
<div class="pull-right">
<button class="button-primary btn-sm" type="submit">Submit</button>
</div>
</fieldset>
</form>
Just by putting disabled in the fieldset all the fields inside of that fieldset get disabled.
只需将 disabled 放在 fieldset 中，该 fieldset 内的所有字段都会被禁用。
$('fieldset').attr('disabled', 'disabled');
回答by AWizardInDallas
I'm using the function below at various points. Works in a div or button elements in a table as long as the right selector is used. Just ":button" would not re-enable for me.
我在不同的地方使用下面的函数。只要使用正确的选择器，就可以在表格中的 div 或按钮元素中使用。只是 ":button" 不会为我重新启用。
function ToggleMenuButtons(bActivate) {
if (bActivate == true) {
$("#SelectorId :input[type='button']").prop("disabled", true);
} else {
$("#SelectorId :input[type='button']").removeProp("disabled");
}
}
回答by Rohit Dubey
Following will disable all the input but will not able it to btn class and also added class to overwrite disable css.
以下将禁用所有输入，但无法将其添加到 btn 类，并且还添加了类来覆盖禁用 css。
$('#EditForm :input').not('.btn').attr("disabled", true).addClass('disabledClass');
css class
css类
.disabledClass{
background-color: rgb(235, 235, 228) !important;
}
回答by irfandar
For me the accepted answer did not work as I had some asp net hidden fields which got disabled as well so I chose only to disable visible fields
对我来说，接受的答案不起作用，因为我有一些 asp 网络隐藏字段也被禁用，所以我选择只禁用可见字段
//just to save the list so we can enable fields later
var list = [];
$('#parent-selector').find(':input:visible:not([readonly][disabled]),button').each(function () {
list.push('#' + this.id);
});
$(list.join(',')).attr('readonly', true);
回答by Laddu Vasanth
Use the CSS Class to prevent from Editing the Div Elements
使用 CSS 类防止编辑 Div 元素
CSS:
CSS：
.divoverlay
{
position:absolute;
width:100%;
height:100%;
background-color:transparent;
z-index:1;
top:0;
}
JS:
JS：
$('#divName').append('<div class=divoverlay></div>');
Or add the class name in HTML Tag. It will prevent from editing the Div Elements.
或者在 HTML 标签中添加类名。它将阻止编辑 Div 元素。
