javascript 使用javascript部分选择复选框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6269342/
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
Partially select checkbox with javascript
提问by AsherMaximum
Is there a way using Javascript and HTML(5) to make a checkbox be partially selected, like the checkboxes in a program installation menu when you select only some of the sub options?
有没有办法使用 Javascript 和 HTML(5) 使复选框被部分选中，例如当您只选择某些子选项时程序安装菜单中的复选框？
回答by kassens
HTML5 definesthe indeterminateboolean property.
HTML5定义了indeterminate布尔属性。
I've tested it only in the latest Safari, Chrome, and Firefox. They all support the indeterminate state.
我仅在最新的 Safari、Chrome 和 Firefox 中对其进行了测试。他们都支持不确定状态。
Example: http://jsfiddle.net/5tpXc/
示例：http: //jsfiddle.net/5tpXc/
Edit:Note that this wont work with older browsers and maybenot with current versions of IE. You'd need to rely on hacks as described in other answers here if you want to support all browsers.
编辑：请注意，这不适用于较旧的浏览器，也可能不适用于当前版本的 IE。如果您想支持所有浏览器，则需要依赖此处其他答案中所述的技巧。
回答by BumbleB2na
Nope. You would have to make a custom checkbox graphic and fake it.
不。您必须制作自定义复选框图形并伪造它。
Edit:Refer to @Kassen's answerfor a way to have partially checked boxes in HTML5-compliant browsers.
编辑：请参阅@Kassen 的答案，了解在符合 HTML5 的浏览器中部分选中复选框的方法。
回答by David
HTML checkboxes (that is, inputelements of type checkbox) don't have a third state (partially checked). So no, there is no direct way to do this.
HTML 复选框（即inputtype 元素checkbox）没有第三种状态（部分选中）。所以不，没有直接的方法可以做到这一点。
What you'd probably have to do is make a custom checkbox-looking image and bind to its various events (click, for example) to store its current "state" in a hiddenform field via JavaScript. You may run into a number of issues with this approach, though.
您可能需要做的是制作一个自定义的复选框外观图像并绑定到其各种事件（例如单击）以hidden通过 JavaScript将其当前“状态”存储在表单字段中。但是，使用这种方法可能会遇到许多问题。
For example, keyboard navigation of the form may not be possible for this particular element. (Can one tab to an image and send it keyboard events? I'm not sure.)
例如，对于这个特定元素，表单的键盘导航可能是不可能的。（可以一个选项卡到图像并将键盘事件发送给它吗？我不确定。）
Additionally, you could try manipulating custom attributes on a checkbox element via JavaScript to store a third state. But the rendering of the element itself has no visual indicator of something like that. You could probably manipulate its style (color, background color, border color, etc.) to try to mimic the visual behavior. But you may not be able to achieve the exact visual style that you're using for reference.
此外，您可以尝试通过 JavaScript 操作复选框元素上的自定义属性来存储第三个状态。但是元素本身的渲染没有类似的视觉指示。您可能可以操纵其样式（颜色、背景颜色、边框颜色等）来尝试模仿视觉行为。但是，您可能无法实现您用作参考的确切视觉样式。
It's certainly an interesting prospect, and I'm intrigued enough that I may try to implement something like this in the near future. But with a native checkbox element, it's not possible. It has only two states.
这当然是一个有趣的前景，我很感兴趣，我可能会在不久的将来尝试实施这样的事情。但是对于本机复选框元素，这是不可能的。它只有两个状态。
Edit:Refer to @kassens' answerfor doing this in HTML5. If you're limited to previous versions of HTML for any reason, then it's going to have to be a hack as described here. But if you can rely on users supporting HTML5, then it looks like native support is there.
编辑：请参阅@kassens'在 HTML5 中执行此操作的答案。如果您出于任何原因仅限于以前版本的 HTML，那么它必须是此处描述的 hack。但是，如果您可以依靠支持 HTML5 的用户，那么看起来本地支持就在那里。
