1

我是编程新手，我试图在没有任何按钮或点击事件的情况下调用一个函数。我正在使用 javascript 函数在表中创建一个表。到目前为止，这是我的代码：

<html>
<head> <title> Hello </title> </head>
<body>
<table border=1>
    <tr>
        <td> Hello! <input type='hidden' value='0' id='theValue' /> <script> add(); </script> <div id='myDiv'> </div> </td>
    </tr>

<script>
$ctra = 1;
$ctr1a = 1;  
function add() { 
    var ni = document.getElementById('myDiv');
    var numi = document.getElementById('theValue');
    var num = (document.getElementById('theValue').value -1)+ 2;
    numi.value = num;
    var newdiv = document.createElement('div');
    var divIdName = 'my'+num+'Div';
    newdiv.setAttribute('id',divIdName);
    newdiv.innerHTML = "<table border=1>"+
                        "<tr>"+
                        "<td> Hello! <input type='hidden' value='0' id='theValue' /> <script> add(); </script> <div id=('" + divIdName + "')> </div> </td>"+
                        "</tr>"+
                        "</table>";
    if($ctra<100){
        ni.appendChild(newdiv);
        $ctra++;
    }
}
</script>

</table>
</body>
</html>


当我运行它时，它显示

"+ ""+ "
Hello!
"; if($ctra<100){ ni.appendChild(newdiv); $ctra++; } }


在浏览器中。问题可能是什么？先感谢您！

编辑

function add() { 
    var ni = document.getElementById('myDiv');
    var numi = document.getElementById('theValue');
    var num = (document.getElementById('theValue').value -1)+ 2;
    numi.value = num;
    var newdiv = document.createElement('div');
    var divIdName = 'my'+num+'Div';
    newdiv.setAttribute('id',divIdName);
    newdiv.innerHTML = "<table border=1><tr><td> Hello! <input type='hidden' value=0 id='theValue' /><div id='" + divIdName + "'></td></tr></table>";
    ni.appendChild(newdiv);
    for(var i=1;i<100;i++) {
        var ni = document.getElementById(divIdName);
        var numi = document.getElementById('theValue');
        var num = (document.getElementById('theValue').value -1)+ 2;
        numi.value = num;
        var newdiv = document.createElement('div');
        var divIdName = 'my'+num+'Div';
        newdiv.setAttribute('id',divIdName);
        newdiv.innerHTML = "<table border=1><tr><td> Hello! <input type='hidden' value='" + i + "' id='theValue' /><div id='" + divIdName + "'></td></tr></table>";
        ni.appendChild(newdiv);
    }
}
4

6 回答 6

3

试试这个

<html>
<head> <title> Hello </title> </head>
<script type="text/javascript">

    $ctra = 1;
    $ctr1a = 1;
    function add() { 
    alert('s')
    var ni = document.getElementById('myDiv');
    var numi = document.getElementById('theValue');
    var num = (document.getElementById('theValue').value -1)+ 2;
    numi.value = num;
    var newdiv = document.createElement('div');
    var divIdName = 'my'+num+'Div';
    newdiv.setAttribute('id',divIdName);
    newdiv.innerHTML = "<table border=1><tr><td> Hello! <input type='hidden' value='0' id='theValue' /></tr></table>";
    if($ctra<100){
        ni.appendChild(newdiv);
        $ctra++;
    }
}

</script>

<body onload="add()">
<table border="1">
    <tr>
        <td> Hello! <input type='hidden' value='0' id='theValue' />

        <div id='myDiv'> </div> </td>
    </tr>
</table>
</body>
</html>

希望对你有帮助..：）

于 2013-03-01T14:20:01.540 回答
2

您的 JS 导致嵌套块，这在 html 中是不允许的。您的块中的函数 add() 未定义，因为当浏览器遇到它时，它还没有看到您对 add() 的定义。您的表包含一个脚本，该脚本包含另一个包含另一个脚本的表。这非常令人困惑：P

好的，如果我理解正确的话：你只有一张桌子。你想让 JS 在里面放另一个表。在此示例中，您要放入的内容是表格的副本。您希望最终得到一个表格内的表格，并且您希望以编程方式实现它。

首先将您的关注点分开：脚本和 html：如果您将 add() 放在定义之后并将脚本放在正文之后，那么浏览器将遇到它并运行它。高温：

<html>
<head> <title> Hello </title> </head>
<body>
    <table id="t1" border=1>
        <tr>
            <td> Hello! <input type='hidden' value='0' id='theValue' />
                <div id='myDiv'></div>
            </td>
        </tr>
    </table>

<script>
    function add_table() {
        var table1 = document.getElementById("t1"),
            table2 = table1.cloneNode(true),
            mydiv = document.getElementById("myDiv"),
            mydiv2;

        table2.setAttribute('id', 't2');
        mydiv2 = table2.getElementsByTagName("div")[0];
        mydiv2.setAttribute('id', 'myDiv2');
        mydiv.appendChild(table2);
    }
    // call the function
    add_table();

</script>
</body>
</html>
于 2013-03-01T15:33:44.247 回答
0

你有</script>里面的代码。浏览器将其解释为 javascript 的结束并返回 HTML。要解决此问题，您可以将此字符串划分为例如</sc'+'ript>. 这将解决这个问题，但可能你仍然需要在脚本上做一些工作，但那是另一回事。

于 2013-03-01T14:15:34.103 回答
0

您必须在不同的引号之间切换，并删除 id 的大括号，如下所示：

newdiv.innerHTML = "<table border=1>"
    +"<tr>"
    +'<td> Hello! <input type="hidden" value="0" id="theValue" /> '
    +'<script> add(); </script> <div id="' + divIdName + '"> </div> </td>'
    +"</tr>"
    +"</table>";
于 2013-03-01T14:15:40.197 回答
0

因为在 dom 中没有任何 evnt 就无法访问该函数。您必须在元素的任何事件上调用该函数。

于 2013-03-01T14:16:27.950 回答
0
  1. 将表格元素外的脚本移动到头部或正文的末尾。
  2. 首先添加div，然后调用脚本。你可能想打电话给add()你<body onload='add'>
  3. 删除此处的大括号以创建有效的 html：<div id=('" + divIdName + "')>
于 2013-03-01T14:19:34.780 回答