2

論理的に 2 つの半分に分割されたテーブルがあります。画像のように行の半分だけを選択する必要があります。 ここに画像の説明を入力

別の「半分」の行を選択した場合は、前の行の選択を解除する必要があります。どうすればいいですか？私のコードはここにあります：

<tr class="line1">
    <td width="10" class="td3523" onclick="selectme('3523');">
        <input type="radio" name="selattendance" id="tr3523" onClick="setEditDelete(3523)"/>
    </td>
    <td width="100" class="td3523" onclick="selectme('3523');">2012-11-19</td>
    <td width="125" class="td3523" onclick="selectme('3523');">
        <table width="100%" cellpadding="0" cellspacing="0" style="border: 0;padding: 0;border-collapse: collapse">
            <tr> 
                <td style="width: 50%;padding-right: 10px;border: 0" align="right" valign="middle">22:54</td>
                <td style="width: 20%;border: 0">     <a href="#" onclick="loadPic('attendanceimages/39286a0a6b45cae9f116b11882f36046.jpg','2012-11-19','2012-11-19','add','','In','22:54:04','22:54:04');"><img src="images/punchimg.png"></a>
                </td>
                <td style="width: 20%;border: 0">&nbsp;</td>
            </tr>
        </table>
    </td>
</tr>

any をクリックすると、同じ ID を持つtdすべての が次のコードを使用して選択されます。td

function selectme(id) {
    $('.td' + id).toggleClass("ui-selected");
}

以前に選択した s からこのクラスを削除する別の行を追加する必要があると思いtdます。どうすればいいですか？ありがとう。

4

3 に答える 3

4

-s に<td>別のクラスを指定tdclssしてから、関数でそれを使用してui-selectedクラスを削除します。

function selectme(id) {
  $('.tdclss').removeClass("ui-selected");
  $('.td' + id).toggleClass("ui-selected");
}
于 2012-12-21T12:33:19.003 に答える
2

1 つのアプローチ:

$('input:radio').change(
    function(){
        // caching the jQuery $(this) object
        var that = $(this);
            that
                // moves up to the closest ancestor table element
                .closest('table')
                // finds the '.selected' elements within that table
                .find('.selected')
                // removes the 'selected' class from those elements.
                .removeClass('selected');
            that
                // moves to the parent td element
                .parent()
                // selects subsequent siblings *until* it finds
                // an element that matches the selector
                .nextUntil($('td:has("input:radio")'))
                // adds back the current td element to the collection
                .andSelf()
                // adds the 'selected' class
                .addClass('selected');
    });​

JS Fiddle のデモ。</p>

参考文献:

于 2012-12-21T12:37:25.967 に答える
-1

同じ ID を持つ複数のフィールドを使用すると、遅かれ早かれ問題が発生します。class 属性を使用してセルをグループ化するか、(おそらく) a を使用してセルをグループ化できます<span>(認めざるを得ませんが、 a<span>内で a を試したことはありません<tr>)。

于 2012-12-21T12:35:05.500 に答える