Gridview如何通过JS设置某行的颜色

Question

RT
我看到网上有通过JS设置间隔行颜色的代码：
var AllRows = document.getElementById(GridViewId).getElementsByTagName("tr");
for(var i=1; i<AllRows.length; i++){
   AllRows[i].style.background = i%2==0?NormalColor:AlterColor;
}问题如下：
1、我按照上面方法，取到的行数比实际显示的行数多很多。
2、我如何设置一行的颜色，也就是我如何确定这一行是哪一行（AllRows[i]中的哪个）
3、如何设置某一行的颜色？？？

Answer 1

那你在for语句中加判断条件呗

Answer 2

1、取到的行数比实际显示的行数多很多这个问题，你可以分析一下源代码，看多出来的tr是做什么用的，分析一下这些tr和你要改背景色的tr有什么不一样的地方。然后在for里面加一个判断
for(var i=1; i<AllRows.length; i++){
   // 加判断条件
   if(AllRows[i].className != "") continue;
   AllRows[i].style.background = i%2==0?NormalColor:AlterColor;
}
2、你这个问题牛到家了，你没有把任何的table代码给我们，你问我们如何确定那一行？
3、你确定了那一行，设置背景你的代码里面不是已经有了吗 AllRows[i].style.background = i%2==0?NormalColor:AlterColor;

Answer 3

 <script type="text/javascript">
        //把事件放在onload里，因为我不知道JS如果直接写到这儿是不是会等页面加载完才执行
        //使用&lt;%=%>方式输出GridView的ID是因为某些情况下（如使用了MasterPage）会造成HTML中ID的变化
        //颜色值推荐使用Hex，如 #f00 或 #ff0000
        window.onload = function () {
            GridViewColor("<%=gvPrice.ClientID%>", "#F8F8F8","#ff");
        }        //参数依次为（后两个如果指定为空值，则不会发生相应的事件）：
        //GridView ID, 正常行背景色,交替行背景色,鼠标指向行背景色,鼠标点击后背景色
        function GridViewColor(GridViewId, NormalColor, AlterColor) {
            //获取所有要控制的行
            var AllRows = document.getElementById(GridViewId).getElementsByTagName("tr");            //设置每一行的背景色和事件，循环从1开始而非0，可以避开表头那一行
            for (var i = 1; i < AllRows.length; i++) {
                //设定本行默认的背景色
                AllRows[i].style.background = i % 2 == 0 ? NormalColor : AlterColor;
            }
        }
    </script>

Answer 4

function setRowColor() {
    var tbls = document.getElementsByTagName("TABLE");    for (var i = 0; i < tbls.length; i++) {        var tbl = tbls[i];        if (tbl.getAttribute('SetRowColor') == 'true') {            setTableColor(tbl);
        }
    }
}function setTableColor(tbl) {
    tbl.style.color = '#333333';
    tbl.style.backgroundColor = '#9CC5DA';    var introwindex = 0;    for (var k = 0; k < tbl.tBodies.length; k++) {
        var tbody = tbl.tBodies[k];        for (var l = 0; l < tbody.rows.length; l++) {            var row = tbody.rows[l];            if (row.style.display == 'none') {
                continue;
            }            if (row.getAttribute('HeaderRow')) { //如果是表头
                if (row.getAttribute('HeaderRow') == 'true') {
                    row.style.backgroundColor = '#D6EFFB';
                } else {
                    row.style.backgroundColor = '#FFFFFF';
                }                continue;
            }            introwindex++;            row.onclick = function () {
                setRowColorOnClick(tbl, this);
            }            if (introwindex % 2 == 1) { // 如果是奇数行
                row.style.backgroundColor = '#F9FBFC';
            } else {
                row.style.backgroundColor = '#EDF6FA';
            }
        }
    }
}// 表中点击列时改变列的颜色
// tbl 表格
// objrow 点击的行
function setRowColorOnClick(tbl, objrow) {
    for (var k = 0; k < tbl.tBodies.length; k++) {
        var tbody = tbl.tBodies[k];        for (var l = 0; l < tbody.rows.length; l++) {            var row = tbody.rows[l];            if (row.style.display == 'none') {
                continue;
            }            if (row.getAttribute('HeaderRow')) { //如果是表头                continue;
            }            var strorgbackgroundColor = 'orgbackgroundColor';            if (row.getAttribute(strorgbackgroundColor) == null) {
                row.orgbackgroundColor = row.style.backgroundColor;
            }            var orgbackgroundColor = row.getAttribute(strorgbackgroundColor); // 原始颜色            if (objrow != row) {
                row.style.backgroundColor = orgbackgroundColor;
                continue;
            }//            if (row.style.backgroundColor == orgbackgroundColor) {
                row.style.backgroundColor = '#B9CDDD';
//            } else {
//                row.style.backgroundColor = orgbackgroundColor;
//            }        }
    }
}这可以实现点击一行变色的效果要在加这种效果的表格上加SetRowColor="true"属性
<table SetRowColor="true">
  <tr HeaderRow="true">
    <td>这是表头</td>
  </tr>
  <tr>
    <td>这是表体</td>
  </tr>
  <tr>
    <td>这是表体</td>
  </tr>
</table>

Answer 5

for (var m = 0; m < myForm.length; m++) {//遍历所有radio
                             if (myForm.elements[m].type == "radio") {
                                 objRadio = myForm.elements[m];
                                 if (objRadio.name == str[i].xmbh) {//如果radio的xmbh跟当前str[i]的xmbh相同，且建议等级和该raido的id相同，则设置为选中
                                     var tr = objRadio.parentNode.parentNode;
                                     var trid = tr.id;
                                     document.getElementById(trid).style.backgroundColor = "#FF7F50";
                                     break;
                                 }
                             }
                         }