3

純粋な JavaScript のみを使用する:

指定したテーブル行をクリックして、選択した行の背景色を変更するにはどうすればよいですか (この例では、赤色を使用します)。

次に、以前に選択された同じ行が再度クリックされた場合、その背景色をデフォルト (白) に戻します。

ここに私のHTMLがあります:

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Language" content="en-ca">

</head>

<body>

<table border="1" cellspacing="1" width="100%" id="table1">
    <tr>
        <th>Column1</th>
        <th>Column2</th>
        <th>Column3</th>
        <th>Column4</th>
        <th>Column5</th>
    </tr>
    <tr>
        <td>data</td>
        <td>data</td>
        <td>data</td>
        <td>data</td>
        <td>data</td>
    </tr>
    <tr>
        <td>data</td>
        <td>data</td>
        <td>data</td>
        <td>data</td>
        <td>data</td>
    </tr>
    <tr>
        <td>data</td>
        <td>data</td>
        <td>data</td>
        <td>data</td>
        <td>data</td>
    </tr>
    <tr>
        <td>data</td>
        <td>data</td>
        <td>data</td>
        <td>data</td>
        <td>data</td>
    </tr>
</table>

</body>

</html>
4

3 に答える 3

6

あなたのTRのこのようなものはうまくいくでしょう..

<tr onclick="this.style.backgroundColor='red'">

編集：あなたの質問を正しく読まなかった..

これはうまくいくでしょう：

<script>
    function changeColor(o){
        o.style.backgroundColor=(o.style.backgroundColor=='red')?('transparent'):('red');
    }
</script>

そしてあなたのtrで：

<tr onclick="changeColor(this)">
于 2013-07-24T19:55:59.260 に答える