1

画像を出力するphpスクリプトがありますが、現時点では画像を選択するにはチェックボックスをクリックする必要があります。親divがクリックされたときにチェックボックスがオンに設定されるように、これを変更したいと思います。

親divに別のIDがある場合、これを行う方法を知っています.phpが出力したすべてのチェックボックスをtrue/falseとして設定するため、クラスは良くないようです。

これは私がこれまでに持っているものです:

JQuery

$('#div').bind('click', function() {
   var checkbox = $(this).find(':checkbox');

    checkbox.attr('checked', !checkbox.attr('checked'));
});

HTML（phpで出力するので複数あります。）

<div id="div" style='display:inline-block; padding:15px;' class='lifted drop-shadow-sq'>
    <img class='reflect reflect-br'  width='150px' height='150px' src=\"thumb.php?id=$id\">
        <input type='checkbox' class=\"show-man\" name=\"images[]\" value='$id'>
</div>

では、他のチェックボックス間で競合が発生しない方法で親 div がクリックされたときに、チェックボックスをチェック済みとして設定するにはどうすればよいですか?

事前に助けてくれてありがとう。

4

3 に答える 3

4

セレクターが間違っていdivます。マークアップにpropID の要素がありません。メソッドを使用できます。

$('div').on('click', function() {
   $('input[type=checkbox]', this).prop('checked', function(i, checked){
      return !checked
   })
});

:checkboxセレクターは非推奨であり、ID は一意でなければならないことに注意してください。同じ ID を持つ複数の要素があり、マークアップが無効であり、ID セレクターがその特定の ID を持つ最初の要素のみを選択する場合は、代わりにクラスを使用する必要があります。

$('.div').on('click', function() {
于 2012-10-25T00:54:05.053 に答える
0

なぜ車輪を再発明するのですか？

HTML ラベル要素をクリックすると、チェックボックスの状態が変わります。代わりにラベルを使用してください。JavaScript は必要ありません。

<label for="cb" style='display:inline-block; padding:15px;' class='lifted drop-shadow-sq'>
    <img class='reflect reflect-br'  width='150px' height='150px' src=\"thumb.php?id=$id\">
        <input id="cb" type='checkbox' class=\"show-man\" name=\"images[]\" value='$id'>
</label>

</p>

于 2012-10-25T01:02:37.027 に答える
0

div ごとに複数のチェックボックスがなく、各チェックボックスが同じクラスを実装すると仮定すると、次の jQuery を使用できます。

$('input[type=checkbox].show-man').each(function(index, value) {
    var self = $(this);
    self.parent().on("click", function() { 
        self.prop('checked', !self.prop('checked'));
    });
});

説明として、$('input[type=checkbox].show-man')関連するすべてのチェックボックスを取得する必要があります (そのため、影響を受けないページに他のチェックボックスと div を引き続き配置できます)。次に、each()メソッドは、各チェックボックスの各親を取得して取得し、それにクリックイベントを割り当てて、関連するチェックボックスのチェック済みステータスを切り替えます。

于 2012-10-25T00:58:19.137 に答える