6

ボタンの中にチェックボックスを入れる方法はありますか?

現時点では、私はこの解決策を持っています：

<html>
<body>
   <div id="menu">
     <button><input type="checkbox" /></button>
   </div>
</body>
</html>

大丈夫です。Chrome と Firefox では問題なく動作しますが、IE では本当にひどいので、この目標を達成するには別の方法が必要です。

1 2

何か案は？ありがとう

4

3 に答える 3

7

checkboxを内に配置するのは有効なマークアップではないと思いますbutton。or を orに置き換えてbuttonorspanにdiv何かCSSを適用してspanorのdivように見せ、それにイベントをbutton適用して状態を変更する方がよいでしょう。clickcheckbox

ほんの一例です

于 2012-06-15T06:56:43.327 に答える
6

あなたがここで何を達成しようとしているのか完全にはわからないので、私の答えがあなたが探していたものではない場合はご容赦ください. チェックボックスの状態を変更するボタンが必要な場合は、@ thecodeparadoxの答えがうまくいくはずですが、機能を実行するだけでなく、切り替え可能なチェックボックスが内部にあるボタンを探している場合は、次のようなもの：

HTML:

<div id="button" href="#">
    <input type="checkbox" class="check">Submit
</div>​

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;
}

<strong>jQuery:

$('#button').on('click', function() {
    window.location = '#';
})​

http://jsfiddle.net/QStkd/278/

于 2012-06-15T09:35:55.677 に答える
1

有効なマークアップではありませんが、jqueryでIEをごまかすことができます-

<button>hi</button>
$('button').prepend('<input type="checkbox" />');

デモ： http： //jsfiddle.net/Gg9fG/

于 2012-06-15T06:52:36.813 に答える