0

这是使用 javascript 动态创建的表，我想使用GetCellValues()函数在警报消息中显示此文本框值。

function makeTable()
{
    row=new Array();    
    cell=new Array();

    row_num=20; 
    cell_num=4;

    tab=document.createElement('table');    
    tab.setAttribute('id','newtable');

    tbo=document.createElement('tbody');    
    tbo.setAttribute('id','tabody');

    for(c = 0;c < row_num; c++)   
    {
        row[c]=document.createElement('tr');

        for(k = 0; k < cell_num; k++)
        {
            cell[k] = document.createElement('td');
            if (k > 0)
            {
                cont=document.createElement("input");
                cont.setAttribute('type','text');
                cell[k].appendChild(cont);
                row[c].appendChild(cell[k]);
            }            
            else
            {
                cont=document.createTextNode("0" + (c+1));
                cell[k].appendChild(cont);
                row[c].appendChild(cell[k]);                    
            }
       }

       tbo.appendChild(row[c]);
    }  

    tab.appendChild(tbo);
    document.getElementById('mytable').appendChild(tab);
    mytable.setAttribute("align", "top-left");
}

请检查GetCellValues()功能，此功能未在警报消息中显示文本框值。

function GetCellValues()
{
    row=new Array();    
    cell=new Array();

    row_num=20;    
    cell_num=4;

    tab = document.getElementsByTagName('table');   
    tbo = tab.getElementsByTagName('tbody');

    for(c = 0;c < row_num; c++)
    {   
        row = tbo.getElementsByTagName('tr');

        for(k = 0; k < cell_num; k++)
        {
             cell = row.getElementsByTagName('td');
             {
                 cont=cell.getElementsByTagName('input');
                 {
                     alert(cont.value);
                 }
             }
         }
     }
}
4

5 回答 5

2

我认为您需要在 GetCellvalues 函数中进行一些修改，因为tab.getElementsByTagName('tbody');不会获得您应该使用的标签名称为 tbody 的元素document.getElementsByTagName。

你可以在这里查看你的代码的工作演示

于 2013-11-06T06:05:07.123 回答
0 
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>

    <table id="mytable"></table>
    <input type="button" onclick="GetCellValues(20, 4);" value="click me" />

    <script type="text/javascript">
        function makeTable() {

            row = new Array();

            cell = new Array();

            row_num = 20;

            cell_num = 4;

            tab = document.createElement('table');

            tab.setAttribute('id', 'newtable');

            tbo = document.createElement('tbody');

            tbo.setAttribute('id', 'tabody');

            for (c = 0; c < row_num; c++) {
                row[c] = document.createElement('tr');

                for (k = 0; k < cell_num; k++) {
                    cell[k] = document.createElement('td');
                    if (k > 0) {
                        cont = document.createElement("input");
                        cont.setAttribute('type', 'text');
                        cont.setAttribute('value', '');
                        cell[k].appendChild(cont);
                        row[c].appendChild(cell[k]);
                    }

                    else {
                        cont = document.createTextNode("0" + (c + 1));
                        cell[k].appendChild(cont);
                        row[c].appendChild(cell[k]);
                    }
                }

                tbo.appendChild(row[c]);
            }

            tab.appendChild(tbo);            
            document.getElementById('mytable').appendChild(tab);
            mytable.setAttribute("align", "top-left");           

        }
        makeTable();

        function GetCellValues(row_num, cell_num) {
            var arrInput = document.getElementsByTagName('input');
            var index = (row_num - 1) * (cell_num - 1);
            alert(arrInput[index].value);            
        }        

    </script>

</body>
</html>
于 2013-11-06T06:03:24.113 回答
0

如果您收到一个带有[object HTMLCollection]消息的警报框，那么您需要 在函数末尾使用alert(cont[0].value)代替。alert(cont.value)GetCellValues

于 2013-11-06T05:29:59.330 回答
0

getElementsByTagName返回集合，您需要遍历它或假设第一个元素 - 适用于row, cell, 例如

var rows = tbo.getElementsByTagName('tr');
for (var c = 0; c < row_num; c++) {
     row = rows[c];
     var cells = row.getElementsByTagName('td');
     for (var k = 0; k < cell_num; k++) {
          cell = cells[k];
          // and so on
     }
}
于 2013-11-06T05:42:43.910 回答
0

一种快捷的方法是使用标签的 ID 属性。

带有 ID 的示例 TD 标签：

<td id="1_1">1st row 1st column</td><td id="1_2">1st row 2nd column</td>

使用 ID 获取 TD 的 Javascript：

var row_len=1,col_len=2;

for (r = 0; r< row_len; r++) {
    for (c = 0; c < coll_len; c++) {
        alert(document.getElementById(r+'_'+c));        
    }
}
于 2013-11-06T06:11:37.093 回答