2009-07-24 17 views
1

ASP MVCでテーブルを作成し、データベースからデータを入力しました。次のコードを使用して、行の色が交互に表示されます。asp mvc一度に1つずつ、テーブルの行の色を変更します。

<% if (count % 2 == 0) { %> 
    <tr class="offeven" onclick="this.className='onclick'" onmouseover="this.className='on'" onmouseout="this.className='offeven'"> 
<% } %> 
<% else { %> 
    <tr class="offodd" onclick="this.className='onclick'" onmouseover="this.className='on'" onmouseout="this.className='offodd'"> 
<% } count++; %> 

各クラスの背景色は異なります。だから私が望むのは、これが起こることです。ユーザーがページに移動すると、テーブルに行の色が交互に表示され、マウスが各行に移動するとその行が色を変えます。行を選択すると、その行は別の色に変わり、マウスが行の範囲を超えた後もそのまま残ります(onmouseoutは機能しません)。今私はgridviewsを使用していた私の古いウェブサイトのための非常にJavascriptの関数を書いたし、彼らは(少なくともいくつかの変更なしで)この場合に動作するとは思わない。 Javascriptを使ってテーブルの行にアクセスし、何をする必要があるのですか?

編集:マウスをその行のスコープから離した後、クリックされた行が背景色を失わないという意味で、:hoverをCSSに追加しました(FFではIE6ではなく)。しかし、最後のハードルは、新しい行がクリックされたときに元の背景色に変更する行が必要だということです。現時点では、各行が強調表示されていますが、強調表示されません。

答えて

2

あなたは

$(”table tr:even”).addClass(”offeven″); 

れるonmouseoverたぶん、より良いクロスブラウザソリューションは、この記事に記載されている

.offeven:hover, .offodd:hover 

を使用するのではなく、ためにいくつかのCSSの減速を追加し、いくつかのjqueryのを使用してそれを行うことができます。

jQuery Alternating Gray Rows in a Table, and Highlight Table Row Mouseover Example

+0

NB彼はie6のjsホバーイベントをコード化する必要があります – redsquare

+0

またはIE6のこの種のソリューションを使用してください:http://snipplr.com/view/1912/internet-explorer-ie6-css-hover/ (is not IE6すでに死んでいますか?) –

+0

彼はこれも使えます:http://www.xs4all.nl/~peterned/csshover.html –

関連する問題