1

私はprototypeJSを使用しており、クリックしたレコードの行を強調表示したい...

ただし、問題は 2 番目の行をクリックしたときです。最初の行を元の状態に戻したいのですが、複数の行が強調表示されるのではなく、最後にクリックした行だけが強調表示されるようにしたいのです。

HTML には行 ID があるため、どの行を使用しているかがわかります。

    <tr id="tblRowThing10434" bgcolor="#DDD">
    <td>10434</td>
    <td>aaa</td>
    <td nowrap="">bbb</td>
    <td nowrap=""><input class="btnSubmit" 
                         type="button" 
                         onmousedown="getAvailableResources( 10434, 'test', 'work' );" 
                         value="Pick" 
                         name="pickThing" ></td>
</tr>
<tr id="tblRowThing33434" bgcolor="#FFF">
    <td>33434</td>
    <td>aaa</td>
    <td nowrap="">bbb</td>
    <td nowrap=""><input class="btnSubmit" 
                         type="button" 
                         onmousedown="getAvailableResources( 33434, 'test', 'work' );" 
                         value="Pick" 
                         name="pickThing" ></td>
</tr>

スクリプトは次のようになります

function getAvailableResources( a, b, c ) {
    elem = 'tblRowLoad' + a;
    $( elem ).setStyle({ backgroundColor: '#fff' });

    //other 'work'
}
4

2 に答える 2

0

の使用をお勧めします: 

.activeRow { background-color:#fff; }
/** in case you are using dirty inline css, add !important here but be ashamed pls */

にいくつかの便利な機能を組み込みます。 

function getAvailableResources( a, b, c ) {
    elem = $('tblRowLoad' + a);

    /** clear all rows */
    elem.siblings().invoke('removeClassName', 'activeRow');
    /** highlight current row */
    elem.addClassName('activeRow');

    //other 'work'
}

これが機能しない場合(たとえば、背景色にクラスを使用しておらず、これを変更できないため (そうすべきです!))、カラー コード (#fff) の後に!importantを追加します。クラス.activeRow。

于 2013-05-26T03:20:57.473 に答える