javascript 使用按钮检查html复选框
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/4639572/
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
check html checkbox using a button
提问by Stefan
I'm struggling to find a solution for this anywhere on Google, maybe i'm searching incorrectly but thought I would come and ask the ever trustworthy members of StackOverflow.
我正在努力在 Google 上的任何地方找到解决方案,也许我搜索错误,但我想我会来询问 StackOverflow 中值得信赖的成员。
I'm wanting to use an html button to check an html check box. There reason I don't want to use the check box will be purely for accessibility reasons because the application i'm developing will be on a terminal and used as via a touch-screen so an HTML check box is too small.
我想使用 html 按钮来检查 html 复选框。我不想使用复选框的原因纯粹是出于可访问性的原因,因为我正在开发的应用程序将在终端上并通过触摸屏使用,因此 HTML 复选框太小。
The only issue is that the list of check box's is dynamic as it is populated using an SQL query. Obviously however I can do the same for creating HTML buttons.
唯一的问题是复选框列表是动态的,因为它是使用 SQL 查询填充的。显然,我可以为创建 HTML 按钮做同样的事情。
Im guessing it will require JavaScript (which I'm perfectly happy using now as I'm finding a lot of the functionality I need in this application needs JavaScript) to do this functionality.
我猜它需要 JavaScript(我现在很高兴使用它,因为我发现这个应用程序中我需要的很多功能都需要 JavaScript)来完成这个功能。
So to clarify: I want to click on a button, say it has a value of "Fin Rot" and that checks the check box with the value "Fin Rot". And then if I clicked another button, say it has a value of "Ich" then it also checks the check box with the value "Ich"
所以澄清一下:我想单击一个按钮,假设它的值为“Fin Rot”,并选中值为“Fin Rot”的复选框。然后,如果我单击另一个按钮,说它的值为“Ich”,然后它还会选中值为“Ich”的复选框
回答by Nick Craver
While you canuse a button and JavaScript for this, might I suggest a much simpler approach? Just use a <label>that's designed justfor this, and style it like a button, for example:
虽然您可以为此使用按钮和 JavaScript,但我可以建议一种更简单的方法吗?只需使用一个<label>它的设计只是对于这一点,和风格它像一个按钮,例如:
<input type="checkbox" id="finRot" name="something" value="Fin Rot">
<label for="finRot">Some text here, could be "Fin Rot"</label>
or (if you don't want to use idon checkboxand foron label):
或(如果您不想使用idoncheckbox和foron label):
<label>
<input type="checkbox" name="something" value="Fin Rot">
Some text here, could be "Fin Rot"
</label>
....then with CSS you can hide the checkbox if needed, but either are clickable to toggle the checkbox.
....然后使用 CSS,如果需要,您可以隐藏复选框,但都可以单击以切换复选框。
You can test out a demo here, also showing some button-ish CSS on the label if needed.
您可以在此处测试演示,如果需要,还可以在标签上显示一些按钮式 CSS。
回答by Dutchie432
This example uses a button to toggle the checkbox on/off.
此示例使用按钮来打开/关闭复选框。
<input type="checkbox" id="finRot" name="something" value="Fin Rot">
<button onclick="document.getElementById('finRot').checked=!document.getElementById('finRot').checked;">Fin Rot</button>
回答by Vishwanath
How about a HTML solution.
HTML 解决方案怎么样。
<p><input type="checkbox"
value="Another check box"
name="cboxwithlabel" id="idbox"><label
for="idbox">Another
checkbox</label></p>
<label> Creates label for the checkbox or radio buttons.
<label> 为复选框或单选按钮创建标签。

