Изменение цвета фона данной строки (событие onClick) в динамической таблице - PullRequest
0 голосов
/ 29 августа 2011

Я создаю динамическую таблицу, которая может иметь несколько строк на основе пользовательского ввода.Я хочу изменить фоновый цвет строки, когда пользователь выбирает / нажимает на любую из строк.Мой код выглядит так: (Закомментированная часть - это пробная версия, которую я сделал, но они не работают)

function Contact_OnUpdateTelephone() {
    $('#tableTelephone > tbody > tr').remove();
    for (var c = 0; c < _updatedTelephoneList.length; c++) {
        var index = _updatedTelephoneList[c].Index;
        var id = _updatedTelephoneList[c].Id;

        $('#tableTelephone tbody:last').append("<tr onclick = GetTelephoneData(" + index + ",'" + id + "');><td>" + index + "</td><td>" + id + "</td></tr>");           
    }       
}



function GetTelephoneData (index, id) {

//Change the color of the clicked (selected) row

//       $("#tableTelephone tbody tr").removeClass("altcol_blue");
//       $(this).addClass("altcol_blue");

//       $("tr").click(function(){
//          $(this).addClass("altcol_blue").siblings("tr").removeClass("altcol_blue");
//       });

        $("#tableTelephone tr td").live( 'click', function () {
            $(this).addClass("altcol_blue").siblings("tr").removeClass("altcol_blue");
        });

Var SelectedIndex = index;
...
...

    }

Мой CSS выглядит так:

table.resulttable tr.altcol_blue td{ height:20px; font-family:Arial, Helvetica, sans-serif; font-weight:normal; color:#444444; font-size:11px; background-color:#deedf5; vertical-align:middle;  padding-left:5px;}

1 Ответ

0 голосов
/ 29 августа 2011

Согласно вашему посту, я думаю, вы хотите знать, как вы можете изменить цвет фона.

Если вы хотите выделить только одну строку Вот идея от I:

    $("#tableTelephone tr td").each(function () {
        if ($(this).parent().hasClass("altcol_blue") == false)
        {
          $("#tableTelephone tr").removeClass("altcol_blue");
          $(this).parent().addClass("altcol_blue");
        }
    });

Идея, лежащая в основе этого способа, состоит в том, чтобы убедиться, что класс 'altcol_blue' будет удален из старой строки.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...