javascript 按钮内的复选框？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11045867/
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
Checkbox inside button?
提问by Clem
Is there any way to get a checkbox inside a button?
有没有办法在按钮内获得一个复选框？
At the moment I have this solution:
目前我有这个解决方案：
<html>
<body>
<div id="menu">
<button><input type="checkbox" /></button>
</div>
</body>
</html>
It's ok, it works fine with Chrome and Firefox...but really awful with IE, so I need another way to achieve this goal.
没关系，它在 Chrome 和 Firefox 上工作得很好……但对 IE 来说真的很糟糕，所以我需要另一种方法来实现这个目标。
Any ideas? Thanks
有任何想法吗？谢谢
回答by thecodeparadox
I think its not a valid mark up to place a checkboxwithin a button. It would be better to replace the buttonwith spanor divand apply some CSSto spanor divto make look like buttonand apply clickevent to that and change the checkboxstate.
我认为将 acheckbox放在 a 中不是有效的标记button。最好button用spanor替换div并应用一些CSS到spanordiv使其看起来像button和应用click事件并更改checkbox状态。
回答by thecodeparadox
I'm not entirely sure what you're trying to achieve here, so please forgive me if my answer isn't what you were looking for. If you want a button which changes the state of a checkbox, then @thecodeparadox's answer should work great, however if you're looking for a button which performs a function but also has a checkbox inside of it which can be toggled, you might want something like the following:
我不完全确定你想在这里实现什么，所以如果我的答案不是你想要的，请原谅我。如果您想要一个更改复选框状态的按钮，那么@thecodeparadox 的答案应该会很好用，但是如果您正在寻找一个执行功能但内部还有一个可以切换的复选框的按钮，您可能想要类似于以下内容：
HTML:
HTML：
<div id="button" href="#">
<input type="checkbox" class="check">Submit
</div>?
CSS:
CSS：
body {
margin: 10px;
}
#button {
display: inline-block;
background: #ddd;
border: 1px solid #ccc;
padding: 5px 10px;
text-decoration: underline;
color: blue;
cursor: pointer;
}
.check {
display: inline-block;
margin-right: 10px;
}
?jQuery:
? jQuery：
$('#button').on('click', function() {
window.location = '#';
})?
回答by Dipak
It's not valid markup but you can cheat IE with jquery -
这不是有效的标记，但您可以使用 jquery 欺骗 IE -
<button>hi</button>
$('button').prepend('<input type="checkbox" />');
