3

私は<tr>それらのいくつかに含まれているものがありますが、含まれて<td>class="myClass"ないものもあります。こんな感じです。

<tr>
<td class="myClass"></td>
<td></td>
</tr>

<tr>
<td></td>
<td></td>
</tr>

にいる場合、?<tr>を含む最も近い行に到達するまで、行を上に移動するにはどうすればよいtd.myClassですか?これを行うための賢い方法はありますか?私が今持っているのは、prev()をチェックするwhileループであり、.myClassが見つかると、壊れます。

4

3 に答える 3

5
$currentTr.prevAll(':has(td.myClass)').first()
于 2012-04-30T03:05:30.433 に答える
1

これは実際の例ですが、それほど素晴らしいものではありませんが、機能します。http://jsfiddle.net/H2k8m/2/
1)クラス「color」のtdが選択されます。
2)それを使用するか、選択したオブジェクトを変数に直接割り当てて、関数の外部で使用することができます。

HTML:

    <table>
        <tr>
        <td class="myClass">Hi</td>
        <td>world</td>
        </tr>

        <tr>
        <td class="myClass">1</td>
        <td class="myClass" >2</td>
        </tr>

        <tr>
        <td>3</td>
        <td>4</td>
        </tr>

        <tr>
        <td>5</td>
        <td>6</td>
        </tr>
</table>

CSS:

.color {
    background: #000;
    color: #fff;
}

table {
    cursor: pointer;
}

tr, td {
    min-width: 50px;
    border: 1px #000 solid;
    padding: 5px;
    text-align: center;
}

Jquery:

$(document).ready(function()
{
    $("table tr td").click(function() {
        if( $(this).prevAll('[class="myClass"]').length <= 0 ) {
            var parents = $(this).parent().siblings();
            for( i = $(this).parent().index(); i >= 0; i-- ) {
                parents.eq( i ).find(".myClass").last().addClass("color");
                if( parents.eq( i ).find(".myClass").length > 0) {
                    break;
                }
            }
         }
        else {
            $(this).prevAll('[class="myClass"]').first().addClass("color");
        }

    });

});
于 2012-04-30T03:51:41.450 に答える
1

myClassクラス名で実際に最も近いtdを見つける別のアプローチがあります。trが必要な場合は、検出されたものの親を取得するだけです。

var td$ = $("#myTable td.myClass");
$("#myTable td").click(function() {
    td$.removeClass("found");
    var temp$ = td$.add(this);
    var i = temp$.index(this);
    if (i > 0) {
        temp$.eq(i - 1).addClass("found");
    }
});

これにより、myClassを使用するすべてのtdのリストが取得されます。次に、クリックした要素をそのjQueryオブジェクトに追加します(jQueryは、追加後にDOM順に並べ替えます)。次に、そのjQueryオブジェクトでクリックされた要素のインデックスを検索し、それが最初のアイテムでない場合は、テーブル内でその前に最も近いtd.myClassオブジェクトとなる前のアイテムを取得します。

jsFiddleの動作:http://jsfiddle.net/jfriend00/XqLzb/

于 2012-04-30T04:36:30.473 に答える