如何在 jQuery 中禁用字段集中的所有元素？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/781584/
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
How can I disable all elements inside a fieldset in jQuery?
提问by AndreMiranda
I have 2 <fieldset>s on my page, but one of them should have all of it elements disabled depending on some user's choice.
我的<fieldset>页面上有 2 个s，但其中一个应该根据某些用户的选择禁用所有元素。
The fieldsets contain text inputs, selects, and links. Is there a way to disable all of them instead of disabling them one by one?
字段集包含文本输入、选择和链接。有没有办法禁用所有这些而不是一个一个地禁用它们？
回答by kgiannakakis
What about using the children selector?
使用子选择器怎么样？
$("#myfieldeset").children().attr("disabled", "disabled");
You can also filter the children selection:
您还可以过滤子选择：
$("#myfieldeset").children("a,input");
回答by Zach Lysobey
You can set the disabledattribute of fieldset.
您可以设置 的disabled属性fieldset。
From MDN:
来自MDN：
If this Boolean attribute is set, the form controls that are its descendants, except descendants of its first optional element, are disabled, i.e., not editable. They won't receive any browsing events, like mouse clicks or focus-related ones. Often browsers display such controls as gray.
如果设置了此布尔属性，则作为其后代的表单控件（除了其第一个可选元素的后代）将被禁用，即不可编辑。他们不会收到任何浏览事件，例如鼠标点击或与焦点相关的事件。浏览器通常将此类控件显示为灰色。
HTML: <fieldset disabled> ... </fieldset>
HTML:<fieldset disabled> ... </fieldset>
JQuery: $('#myfieldset').prop('disabled', true);
查询：$('#myfieldset').prop('disabled', true);
JS: document.getElementById('#myFieldset').disabled = true;
JS：document.getElementById('#myFieldset').disabled = true;
IE note:
IE注意：
This does not work quite right on Internet Explorer due to a couple bugs, but works well just about everywhere else (including Edge).
由于一些错误，这在 Internet Explorer 上无法正常工作，但几乎在其他任何地方（包括Edge）都能正常工作。
In short, Text and File inputs don't properly disable, and the user can still interact with them.
简而言之，文本和文件输入没有正确禁用，用户仍然可以与它们交互。
If this is a deal breaker, you need to go into the and put the disabledattribute on the <fieldset>'s descendant form controls as described in other answers here.
如果这是一个交易破坏者，您需要按照此处的其他答案中的描述进入 并将disabled属性放在<fieldset>的后代表单控件上。
Browser support info: http://caniuse.com/#feat=fieldset-disabled
回答by pjesi
Assuming you set a class="disableMe" on the fieldset you want to disable any input elements then the following code should do what you need:
假设您在要禁用任何输入元素的字段集上设置了 class="disableMe"，那么以下代码应该可以满足您的需求：
$('fieldset.disableMe :input').attr('disabled', true)
回答by franzlorenzon
Why don't you just use:
你为什么不使用：
$("#myfieldeset").attr("disabled", "disabled");
$("#myfieldeset").attr("disabled", "disabled");
It worked for me. It disabled nicely all the children inputs.
它对我有用。它很好地禁用了所有儿童输入。
EDIT:note thas the disabled attribute can be applied to fieldset element only in HTML5 (see merryprankster comment). Strangely enough, it does work with other browser than just Firefox and Opera, such as Chrome and Internet Explorer (tested IE7 and IE8).
编辑：请注意， disabled 属性只能应用于 HTML5 中的 fieldset 元素（请参阅 merryprankster 评论）。奇怪的是，它确实适用于 Firefox 和 Opera 之外的其他浏览器，例如 Chrome 和 Internet Explorer（经过 IE7 和 IE8 测试）。
回答by user729356213908560
In addition to what others posted:
除了其他人发布的内容：
Use .prop()instead of .attr():
使用.prop()代替.attr()：
$('#myfieldset').prop('disabled',true)
It is more correct with regard to the DOM.
关于 DOM 更正确。
And it does not seem to work well with validation. Both firefox and chrome won't let me submit the form With unfilled 'required' inputs in the disabled fieldset, but don't give any instructions on how to complete the form either.
它似乎不适用于验证。firefox 和 chrome 都不允许我在禁用的字段集中提交带有未填写的“必需”输入的表单，但也不提供有关如何完成表单的任何说明。
回答by KyleFarris
If for some reason you can't add an ID to the fieldset (which is usually preferred), you can always do this to hide all it's children elements:
如果由于某种原因您无法将 ID 添加到字段集（通常是首选），您可以随时执行此操作以隐藏它的所有子元素：
$('fieldset:first > *').attr('disabled','disabled');
