innerHtml中的onBlur阻止了这个功能

时间:2012-05-14 12:30:43

标签: javascript

我有2个函数,一个是动态创建一个带有输入字段的表,其中维度基于用户插入的变量k,另一个读取用户在每个字段中再次插入的值。表并将它们插入一个我可以稍后调用的二维数组中。 问题是create table函数不能与插入其代码中的onBlur一起使用。 代码如下:

<head>
    <script>
        var k;


            function genArray () {
                var A = [];
                    for (var i = 0; i < k; i++) {
                        A[i] = [];
                        for (var j = 0; j < k; j++) {
                            var id = "A" + (i + 1) + (j + 1);
                            A[i][j] = parseFloat(document.getElementById(id).value);
if (isNaN (A[i][j])) { 
                            alert ('Valoarea 'A[i][j]' nu este un numar. Reintroduceti valoarea');
}
                        }
                    }                       
            }

            function readGrad() {               
                k = parseInt(document.getElementById("grad").value);            
                if (isNaN(k)) {
                    alert('Gradul introdus nu este intreg, reintroduceti gradul matricii');
                }
                if (k == 0) {
                    alert ('Determinantul trebuie sa fie mai mare ca 1');
                }
                if (k == 1) {
                    alert ('Determinantul trebuie sa fie mai mare ca 1');
                }
                return k;
            }       

            function genTable(i,j) {            
                //var i,j = parseInt(document.getElementById("grad").value);
                var myTable = '<TABLE BORDER="1" BORDERCOLOR="BLACK">\n <TBODY>\n';
                for (i = 0; i < 1; i++) {
                    myTable += '  <TR>\n';
                    for (j = 0; j < k+1; j++) {
                        myTable += '    <TD>'+j+'</TD>\n';
                    }
                    myTable += '  </TR>\n';
                }
                for (i = 1; i < k+1; i++) {
                    myTable += '  <TR>\n';
                    for (j = 0; j < 1; j++) {
                        myTable += '    <TD>'+i+'</TD>\n';
                    }
                    for (j = 1; j < k+1; j++) {
                    myTable += '    <TD><input class="element" id="A' + i + j + '" onblur="genArray()"></TD>\n';
                    } 
                    myTable += '  </TR>\n';
                }
                myTable += ' </TBODY>\n</TABLE>\n';
                document.getElementById('container').innerHTML = myTable;
            }
    </script>
</head>

<body style="background-color: #777; color: ddd;">
    <div style="margin: 20px;">
        <h1>Program de calculare determinant matrice de orice grad.</h1>
    </div>
    <div>
        Introduceti gradul matricei
        <input id="grad" type="text" value="" style="width: 50px;" onChange="readGrad()">           
        <input style="margin-top: 20px;" type="button" name="Calculate determinant" value="Generati tabel" onClick="genTable()"> 
    </div>
    <form name="Det Matrice">
        <div style="margin-top: 100px; float: left; width: 100%;">
            Introduceti valorile: 
            <table style="text-align: center;">
                <div id="container"></div>
            </table>
            <br>
        </div>
</body>

3 个答案:

答案 0 :(得分:1)

尝试使用onblur="genArray()"代替onBlur="genArray()"

请注意,它全部是小写字母!

答案 1 :(得分:1)

您的代码运行正常。只需更正第15行中的语法错误,如jbabey在评论中所描述的那样。

答案 2 :(得分:1)

在更正警报的语法错误后,genTable()可以正常工作。但是你的代码中存在逻辑问题。您将onblur事件处理程序添加到生成的表格单元格中的每个文本字段。因此,每个单元格输入都会触发对onblur事件处理程序的调用,该处理程序将迭代整个表格。我不认为这是你想要的。此外,在迭代期间,您的parseFloat函数将在所有空单元格上失败。您只应使用按钮触发对genArray()的一次调用。