Question

我尝试使用javascript对象排序方法在我自己的样式上对html表进行排序。我有一个非常特殊的问题。 1.我将所有表数据（单元格值）传递给指定的对象..完成!!! 然后我使用object.sort对该对象值进行了排序... DONE !!! 3.现在排序后，我想将已排序的行分配回表..这里我卡住..我得到排序的行。但是当我将它分配给forloop中的变量时，它会被分配给＆＃39; nTable＆＃39;变量。完成循环后，当它出现时，＆＃39; nTable＆＃39;变量变空了。我尝试了字符串转换和很多东西。但我无法找到它。请帮忙。提前致谢。以下是我的代码

    function doSort(ColNo)
    {

        var objCols =[];
        var totalRows =  document.getElementById('cities').rows.length;

        for (var i=1; i < totalRows; i++)
        {
            var x = document.getElementById('cities').rows[i].cells;                
            objCols [i]= {rIndex:i, cellVal:x[ColNo].innerHTML};
        }

        objCols.sort(function(a, b)
        {
            var x = a.cellVal.toLowerCase();
            var y = b.cellVal.toLowerCase();
            if (x < y) {return -1;}
            if (x > y) {return 1;}
            return 0;
        });

        var nTable = '<table id="cities" style="border:solid;">';
        nTable += '<thead style="text-align:center; background-color:green; color:white">';
        nTable += '<tr>';
        nTable += '<th onclick="doSort(this.cellIndex)">Indian Cities</th>';
        nTable += '<th onclick="doSort(this.cellIndex)">State</th>';
        nTable += '</tr>';
        nTable += '</thead>';
        nTable += '<tbody>';


            for (i = 1; i < totalRows; i++)
            {
                var rowNo = objCols[i].rIndex;

                nTable += '<tr>' + document.getElementById('cities').rows[rowNo].innerHTML + '</tr>';
            }

            alert (nTable);
        nTable + ='</tbody>';
        nTable + ='</table>';

        document.getElementById('cities').innerHTML = "";
        document.getElementById('cities').innerHTML = nTable;       
    }
</script>
</head>

<body>
    <table id="cities" style="border:solid;">
        <thead style="text-align:center; background-color:green; color:white">              
            <tr>
                <th onclick="doSort(this.cellIndex)">Indian Cities</th>
                <th onclick="doSort(this.cellIndex)">State</th>
            </tr>

        </thead>
        <tbody>
            <tr>
                <td>Coimbatore</td>
                <td>Tamilnadu</td>
            </tr>
            <tr>
                <td>Chennai</td>
                <td>Tamilnadu</td>
            </tr>
            <tr>
                <td>Madurai</td>
                <td>Tamilnadu</td>
            </tr>
            <tr>
                <td>Hyderabad</td>
                <td>Andhra Pradesh</td>
            </tr>
            <tr>
                <td>Mumbai</td>
                <td>Maharashtra</td>
            </tr>
            <tr>
                <td>Panaji</td>
                <td>Goa</td>
            </tr>
            <tr>
                <td>Delhi</td>
                <td>Delhi</td>
            </tr>
            <tr>
                <td>Bangalore</td>
                <td>Karnataka</td>
            </tr>
            <tr>
                <td>Calicut</td>
                <td>Kerala</td>
            </tr>
            <tr>
                <td>Kolkota</td>
                <td>West Bengal</td>
            </tr>
        </tbody>
    </table>
</body>

Answer 1

    function doSort(ColNo)
      {
     var objCols =[];
     var totalRows =  document.getElementById('cities').rows.length;

    for (var i=0; i < totalRows; i++)
    {
        var x = document.getElementById('cities').rows[i].cells;                
        objCols [i]= {rIndex:i, cellVal:x[ColNo].innerHTML};
    }

     objCols.sort(function(a, b)
     {
        var x = a.cellVal.toLowerCase();
        var y = b.cellVal.toLowerCase();
        if (x < y) {return -1;}
        if (x > y) {return 1;}
        return 0;
      });

       var nTable = '<table id="cities" style="border:solid;">';
       nTable += '<thead style="text-align:center; background-color:green; color:white">';
    nTable += '<tr>';
    nTable += '<th onclick="doSort(this.cellIndex)">Indian Cities</th>';
    nTable += '<th onclick="doSort(this.cellIndex)">State</th>';
    nTable += '</tr>';
    nTable += '</thead>';
    nTable += '<tbody>';


        for (i = 0; i < totalRows; i++)
        {
           if(objCols[i]) { 
           var rowNo = objCols[i].rIndex;
            nTable += '<tr>' + document.getElementById('cities').rows[rowNo].innerHTML + '</tr>';
           }
        }
    nTable +='</tbody>';
    nTable +='</table>';

    document.getElementById('cities').innerHTML = "";
    document.getElementById('cities').innerHTML = nTable;       
}

您的速记运算符就像 + = 。它应该是 + =

查看更改的代码。它有效并且您可以获得已排序的数据。

修改这是一个小提琴。 https://jsfiddle.net/f0L0s674/2/

排序的对象不会在javascript中传递给字符串变量

1 个答案: