0

TRで次のことができる必要があります。

  • onmouseoverは、行全体を1色で強調表示します
  • 行をクリックすると、行が別の色で強調表示されます（同じ行をもう一度クリックすると、行の強調表示が解除され、元のbgcolorに設定されます）
  • 私が抱えている問題は、リストビューで行のbgcolorが2つの色を交互に繰り返すことです。
  • 以下のコードは、一度に1行を強調表示する場合にのみ機能します。行は、もう一度クリックされるまで強調表示されたままにする必要があります。

これは、クリックして機能するものを選択するために使用するコードですが、行のハイライトのオン/オフを切り替えるように変更する必要があります

<script type="text/javascript"> 
var preEl;
var orgBColor;
var orgTColor;
function highlighttr(el, backColor, textColor) {
    if (typeof (preEl) != 'undefined') {
        preEl.bgColor = orgBColor;
        try { ChangeTextColor(preEl, orgTColor); } catch (e) { ; }
    }
    orgBColor = el.bgColor;
    orgTColor = el.style.color;
    el.bgColor = backColor;

    try { ChangeTextColor(el, textColor); } catch (e) { ; }
    preEl = el;
}


function ChangeTextColor(a_obj, a_color) {
    ;
    for (i = 0; i < a_obj.cells.length; i++)
        a_obj.cells(i).style.color = a_color;
}
</script>
4

2 に答える 2

2
  • onmouseoverは、行全体を1色で強調表示します

スタイル:hoverに追加tr

  • 行をクリックすると、行が別の色で強調表示されます（同じ行をもう一度クリックすると、行の強調表示が解除され、元のbgcolorに設定されます）

    $('tr').click( function () {
    if($(this).hasClass("clicked"))
    {
        $(this).removeClass("clicked");
    }else{
        $(this).addClass("clicked");
}
});

それにスタイルを追加します。

  • 私が抱えている問題は、リストビューで行のbgcolorが2つの色を交互に繰り返すことです。

:nth-child(2n)スタイルに追加して、すべてをまとめることができます。

例

http://jsfiddle.net/uuZdB/6/

于 2012-06-16T11:21:45.493 に答える
1

これは、ちなみにクロスブラウザ（およびプラットフォーム）である従来の方法です。

CSS

.tr {background-color:#fff}
.trOver {background-color:#ddd}
.trClicked {background-color:#bbb}

JS

function over(o)
{
    if ('trClicked' != o.className) o.className = 'trOver';
}
function out(o)
{
    if ('trClicked' != o.className) o.className = 'tr';
}
function clicked(o)
{
    o.className = ('trClicked' == o.className) ? 'tr' : 'trClicked';
}

HTML

<tr class="tr" onmouseover="over(this)" onmouseout="out(this)" onclick="clicked(this)">
    // tds without defined background color...
</tr>
于 2012-06-16T11:38:29.570 に答える