Question

这是html

<table>
<tr>
    <td>
        1
    </td>
     <td>
        2
    </td>
     <td>
        3
    </td>
     <td>
         <input type ="button" value = "change" class = "change" />
    </td>
</tr>
 <tr>
    <td>
        4
    </td>
     <td>
        5
    </td>
     <td>
        6
    </td>
     <td>
         <input type ="button" value = "change" class = "change" />
    </td>
</tr>
 <tr>
    <td>
        7
    </td>
     <td>
        8
    </td>
     <td>
        9
    </td>
     <td>
         <input type ="button" value = "change" class = "change" />
    </td>
</tr>
 <tr>
    <td>
        7
    </td>
     <td>
        8
    </td>
     <td>
        13
    </td>
     <td>
         <input type ="button" value = "change" class = "change" />
    </td>
</tr>

这是我的jquery

 $(".change").click(function(e){
 debugger;
    localStorage.setItem("visited" + $(this).closest("tr").index(), true);
    $(this).css("color", "red"); // visited
});

 for(var i = 0, len = $(".change").length; i < len; i++) {

if(localStorage.getItem("visited" + i)) {
    $(".change").eq(i).css("color", "white").prop('disabled', true).val('generated'); // visited
} else {
    $(".change").eq(i).css("color", "black"); // not visited
}
}
});

问题

-only the odd numbers of row button is affected.
-how shiuld i change the background color of the row on button click.

Answer 1

尝试将id提供给tr元素，然后点击按钮调用javascript函数，该函数将更改行的背景颜色。演示代码如下所示：

HTML代码

<tr id="rowid1">
    <td>
        1
    </td>
    <td>
        2
    </td>
    <td>
        3
    </td>
    <td>
        <input type="button" value="change" class="change" onclick="javascript:changecolor('rowid1')" />
    </td>
</tr>

Javascript代码

function changecolor(rowid)
{
    alert(rowid);
    document.getElementById(rowid).style.backgroundColor="lightblue";
}

更改行localstorage的颜色？

1 个答案: