javascript - onclick 背景色の変更

Question

URLを変更するクリックイベントでテーブル行の背景色を変更するにはどうすればよいですか? 基本的に、ページが実際に変更される前にボタンまたはテーブル行がクリックされたというフィードバックをユーザーに提供するために、ページが新しい URL をロードするのにかかる時間だけ新しい背景色が必要です。

Answer 1

I think this is like showing a loading animation on an ajax call or something. You can try a Jquery. If the table row has an ID then

$('tablerow').click (function(){
         $('tablerow').css("background-color","red");
});

Or you can use to fire this function on any other events like button click or link click etc ...

Check this Jquery change background color

Answer 2

フィドル: http://jsfiddle.net/83wBV/

HTML

<table id="tbl">
    <tr>
        <td>row 1 cell 1</td><td>row 1 cell 2</td>
    </tr>
    <tr>
        <td>row 2 cell 1</td><td>row 2 cell 2</td>
    </tr>
</table>

CSS

table, tr, td {
    border: solid 1px #444;
    border-collapse: collapse;
    color: white;
}

tr {
    background-color: #47F;
}

td {
    padding: 0 10px;
}

JS

function onClick(evt) {

    var el = evt.target;
    if (el.tagName.toLowerCase() == "td") 
        el = el.parentNode;

    el.style.backgroundColor = "#F74";

}



document.getElementById("tbl").addEventListener("click", onClick);