使用 jQuery/JavaScript 隐藏和禁用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/11957915/
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
Hide and disable with jQuery/JavaScript
提问by Joe
I have a section of my page that I want to hide when the user clicks a certain radio button. But in addition to hiding the area, I want disable all inputs in that area. I also want to bring back the area when the user hits another button.
当用户单击某个单选按钮时,我想隐藏我的页面的一部分。但除了隐藏该区域之外,我还想禁用该区域的所有输入。我还想在用户点击另一个按钮时恢复该区域。
What is the best way to go about doing this?
这样做的最佳方法是什么?
回答by thecodeparadox
You can try something like below:
您可以尝试以下操作:
$('#make_hide_button').on('click', function() {
$('#target_area').hide().find('input, textarea').prop('disabled', true);
});
$('#make_show_button').on('click', function() {
$('#target_area').show().find('input, textarea').prop('disabled', false);
});
回答by Nope
As you have specified no current code you are working with I can only give you a few general guidelines.
由于您没有指定您正在使用的当前代码,因此我只能为您提供一些通用指南。
Have a look at jQuery hide():
看看 jQuery hide():
$("#myDivId").hide();
Check how to bind click events using on()
检查如何使用on()绑定点击事件
$("#MyRadioButton").on("click", function(){
$("#myDivId").hide();
});
$("#MyOtherButton").on("click", function(){
$("#myDivId").show();
});
To disable/enable elements:
禁用/启用元素:
$("#MyElementId").prop("disabled", false);
$("#MyElementId").prop("disabled", true);
Again, this is something to get your started, ones you have some code you experience issues with, please feel free to post it and I'm sure we can manage to help you out.
同样,这是让您开始的东西,您有一些代码遇到问题,请随时发布它,我相信我们可以设法帮助您。
回答by Travis J
More code in your question would definitely have a strong relation to having code in answers.
您的问题中的更多代码肯定与答案中的代码有很强的关系。
That being said, a general approach is going to be making sure you know which area the input was in. Perhaps with data-
attributes or a javascript array of ids, or maybe by classname.
话虽如此,一般的方法是确保您知道输入位于哪个区域。也许使用data-
属性或 javascript id 数组,或者通过类名。
Once the area is well defined, you can hide the radio button, and then iterate through the defined area disabling any elements which are of type input.
一旦区域定义好,您可以隐藏单选按钮,然后遍历定义的区域,禁用输入类型的任何元素。
EDIT
编辑
Assumptions:
假设:
<script type="text/javascript">
function GetParentForm(elem) {
while (elem && elem.nodeName && elem.nodeName.toUpperCase() != "FORM") {
elem = elem.parentNode;
}
return elem;
}
var changeState = 0;
$("#radButt").click( function() {
$(this).hide();
var thisForm = GetParentForm( $(this)[0] );
$(thisForm).find('input').prop('disabled', true);
});
</script>
<script type="text/javascript">
function GetParentForm(elem) {
while (elem && elem.nodeName && elem.nodeName.toUpperCase() != "FORM") {
elem = elem.parentNode;
}
return elem;
}
var changeState = 0;
$("#radButt").click( function() {
$(this).hide();
var thisForm = GetParentForm( $(this)[0] );
$(thisForm).find('input').prop('disabled', true);
});
</script>