javascript 防止用户更改单选按钮的状态
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7116217/
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
preventing a user from changing the state of a radio button
提问by Ben
I am trying to prevent a user from changing the state of a radio button using jquery or javascript. I could do this with the disabled property but I don't like the grayed out look. I am showing the user a true/false state of one of my models, so I don't want them to be able to change it. There is only one radio button in the group that is either checked (true) or unchecked (false) based on the model, so they can't uncheck it but they can check and change the radio button state. The radio button doesn't get submitted in a form so it is only for reading from the database/model but it would be a bad user experience if they changed it to the opposite value that is actually in the database. Here is my latest attempt at the jquery and html structure.
我试图阻止用户使用 jquery 或 javascript 更改单选按钮的状态。我可以用 disabled 属性来做到这一点,但我不喜欢灰色的外观。我向用户展示了我的一个模型的真/假状态,所以我不希望他们能够改变它。该组中只有一个单选按钮基于模型被选中 (true) 或未选中 (false),因此他们无法取消选中它,但他们可以选中和更改单选按钮状态。单选按钮不会在表单中提交,因此它仅用于从数据库/模型中读取,但如果他们将其更改为实际在数据库中的相反值,则会带来糟糕的用户体验。这是我对 jquery 和 html 结构的最新尝试。
<input type="radio" checked="checked">
or
或者
<input type="radio">
and the jquery
和 jquery
$(document).ready(function () {
$(input[type = "radio"]).change(function () {
$(this).removeAttr("checked");
});
});
回答by shinkou
How about
怎么样
<input type="radio" onclick="return false;"/>
or
或者
$(document).ready(function () {
$(input[type = "radio"]).click(function () {
return false;
});
});
?
?
回答by ShankarSangoli
Try this
试试这个
$(document).ready(function () {
$('input[type = "radio"]').change(function () {
return false;
});
});
回答by Scott Ferguson
Try using the disabled property, since that is what it is for, but then change the style of the radio button using CSS.
尝试使用 disabled 属性,因为这就是它的用途,然后使用 CSS 更改单选按钮的样式。
However, that doesn't sound like a very intuitive User Experience. Users know what grayed out means, you probably shouldn't mess with that!
然而,这听起来不像是一种非常直观的用户体验。用户知道变灰意味着什么,您可能不应该弄乱它!
回答by Ben
So once I got the quotes on my selector correct it worked.
所以一旦我得到了我的选择器上的引号正确它就起作用了。
$("input[type = radio]")
or
或者
$("input[type = 'radio']")
there are a bunch or options for the code of the change function that worked
有很多更改功能的代码或选项起作用
this = false;
$(this).prop("checked", false);
$(this).attr("checked", false);
$(this).removeAttr("checked");
$(this).removeProp("checked");
Is there advantage to using one over the other? Is there a difference between the any of the four jquery functions to manipulate a tag's properties/attributes? Based on the docs it looks like prop/removeProp were just added in 1.6 and attr/removeAttr were added in 1.0 so are the attr/removeAttr just around for legacy purposes or is jquery suggesting one over the other?
使用一个比另一个有优势吗?操作标签的属性/属性的四个 jquery 函数中的任何一个之间是否有区别?根据文档,看起来 prop/removeProp 刚刚添加到 1.6 中,而 attr/removeAttr 则添加到 1.0 中,那么 attr/removeAttr 是出于遗留目的还是 jquery 建议一个而不是另一个?