使用Javascript将列和行的名称显示为坐标

时间:2016-01-26 05:52:19

标签: javascript

大家好我只是想问一下如何在excel中显示我的表格的行名和列名?这是我在Internet上找到的示例代码,但它不起作用。谢谢:)

function createCell(cell, text, style) {
    var column_num = parseInt( $(this).index() );
    var row_num = parseInt( $(this).parent().index() );
    var div = document.createElement('div'), // create DIV element
        txt = document.createTextNode(text); // create text node
    div.appendChild(txt);                    // append text node to the DIV
    div.setAttribute('class', style);        // set DIV class attribute
    div.setAttribute('row_num','column_num',style);    // set DIV class attribute for IE (?!)
    cell.appendChild(div);                   // append DIV to the table cell
    cell.setAttribute('row_num', 'column_num');
}

添加新行的代码

    <input type="button" id="add" value="Add row" onclick="Javascript:appendRow()">
    <input type="button" id="add" value="Add column" onclick="Javascript:appendColumn()">



<script type="text/javascript">
// append row to the HTML table
     function appendRow() {
         var tbl = document.getElementById('my-table'), // table reference
             row = tbl.insertRow(tbl.rows.length),      // append table row
             i;
        // insert table cells to the new row
        for (i = 0; i < tbl.rows[0].cells.length; i++) {
            createCell(row.insertCell(i), i, 'row');
        }
     }
</script>

点击此处查看Required Output

1 个答案:

答案 0 :(得分:0)

我试图实现代码,但我不确定setAttribute for IE中row_num和column_num的功能

$("#test-table tr").each(function() {
    $('td', this).each(function () {
         createCell(this, $(this).parent().index() + ',' + $(this).index(), "red");
     })
})
function createCell(cell, text, style) {
    var column_num = parseInt( $(this).index() );
    var row_num = parseInt( $(this).parent().index() );
    var div = document.createElement('div'), // create DIV element
        txt = document.createTextNode(text); // create text node
    div.appendChild(txt);                    // append text node to the DIV
    div.setAttribute('class', style);        // set DIV class attribute
    div.setAttribute('row_num','column_num',style);    // set DIV class attribute for IE (?!)
    cell.appendChild(div);                   // append DIV to the table cell
    cell.setAttribute('row_num', 'column_num');
}

检查Fiddle是否有实施