使用按钮检查html复选框 [英] check html checkbox using a button

问题描述

我很努力地在Google的任何地方找到这个解决方案，也许我找不正确，但认为我会来问问StackOverflow的可靠成员。 p>我想要使用html按钮来检查一个html复选框。有理由我不想使用复选框纯粹是为了访问的原因，因为我正在开发的应用程序将在终端上，并通过触摸屏使用，因此HTML复选框太小。

唯一的问题是复选框的列表是动态的，因为它使用SQL查询填充。很明显，我可以做同样的事情来创建HTML按钮。

我猜这需要JavaScript（我现在非常开心，因为我发现了很多我在这个应用程序中需要的功能需要JavaScript）来执行此功能。

因此，为了澄清：我想单击一个按钮，并说它的值为Fin腐烂，并选​​中Fin Rot值复选框。然后如果我点击另一个按钮，说它有一个Ich的值，那么它也会检查值为Ich的复选框。 div>

尽管你可以使用按钮和JavaScript来实现这个功能，但是我可以建议一个更简单的方法吗？只需使用设计为 的< label> 就可以了，例如：

 < input type =checkboxid =finRotname =somethingvalue =Fin Rot> 
< label for =finRot>这里的一些文字，可能是Fin Rot< / label> 
  

或（如果您不想使用 id 复选框和 在标签

 < label> 
< input type =checkboxname =somethingvalue =Fin Rot> 
这里有些文字，可能是Fin Rot
< / label> 
  

....然后用CSS你可以隐藏复选框（如果需要的话），但可以点击切换复选框。

您可以测试一个这里演示，如果需要，还会在标签上显示一些按钮CSS。

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.

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.

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.

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.

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"

解决方案

While you can use a button and JavaScript for this, might I suggest a much simpler approach? Just use a <label> that's designed just for this, and style it like a button, for example:

<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 id on checkbox and for on 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.

You can test out a demo here, also showing some button-ish CSS on the label if needed.

这篇关于使用按钮检查html复选框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！