1

各行にチェックボックスが付いたテーブルがあります。チェックボックス以外のtrをクリックしたときに発生する.click関数を実行したい。

行にはclass="message"があり、チェックボックスを含むtdにはclass="ignore_checkbox"があります。

これは私のjquery/jsです：

$('.message').not('.ignore_checkbox').click(respondToMessage);

ただし、チェックボックスをクリックすると、respondToMessage関数が呼び出されます。何か案は？

<?php foreach ($accountMessages as $accountMessage): ?>
<tr class="message overview">
    <td class="ignore_checkbox" ><?php echo $this->Form->checkbox(
        'AccountMessages.'.$accountMessage['AccountMessage']['id'], 
        array('value' => $accountMessage['AccountMessage']['id'],
        'hiddenField' => false,
        'multiple' => true)); ?>
    </td>
    <td>
        <strong><?php echo h($accountMessage['Account']['email']);?></strong><br/>
        <span class="message_time"><?php echo $this->Time-                      TimeAgoInWords($accountMessage['AccountMessage']['created'], array('format' => 'F jS, Y', 'end' => '+1 year') )?></span>
        <?php echo h($accountMessage['AccountMessage']['title']); ?><br/>
        <?php echo h($accountMessage['AccountMessage']['message']); ?>

    </td>
</tr>
<?php endforeach; ?>
4

5 に答える 5

2

td次のように、を既存のルールに追加するだけです。

$('.message td').not('.ignore_checkbox').click(respondToMessage);

作品を使用するというあなたの考えは.not()、一致する要素でのみ機能します。ルールはテーブルの行から始まるため、<tr>は.not()何にも一致しません。代わりにテーブルセルを照合することで、正常<td>に機能します。

これがjsFiddleの簡単な例です。

于 2012-10-26T17:12:29.427 に答える
1

e.stopPropagationtdをクリックするとイベントがバブルアップするため、チェックボックスを含むtdで実行する必要がありますTR

$('.ignore_checkbox').click (function (e) {
   e.stopPropagation();
});

.messageまたは、他の回答のようにハンドラー内で処理できます。

于 2012-10-26T17:09:19.257 に答える
0 
$('.message').click(function(event) {

    if ( ! $(event.target).hasClass('ignore_checkbox') )
    {
        respondToMessage();
    }
});

いつものように、要素に対して1つのイベントリスナーのみを使用することをお勧めします。これにより、要素に含まれるすべての行でクリックイベントをリッスンできます。このようにして、リソースを節約し、すべてに対して1つのイベントリスナーのみが必要になります。

ここでフィドルを確認してください。

于 2012-10-26T17:10:51.487 に答える
0

イベントバブリングを使用してみてください。

$('.message').on('click', ':not(.ignore_checkbox)', function(event) {
// enter code here
});
于 2012-10-26T17:11:48.147 に答える
0

これを試して

$('.message').on('クリック', function(e) {

if( e.target.className.indexOf('ignore_checkbox') > -1 
     || e.target.type == 'checkbox'){
       // do Nothing
 }
else{
     alert('Not checkbox');
}

}); </p>

フィドルをチェック

于 2012-10-26T17:09:17.163 に答える