Question

我是编程新手，我试图在没有任何按钮或点击事件的情况下调用函数。我正在使用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);
    }
}

Answer 1

试试这个

<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>

希望它对你有用.. :)）

Answer 2

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

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

首先分开您的疑虑：脚本和HTML：如果你在定义之后放置你的add（）并将你的脚本放在正文之后，那么浏览器将遇到它并运行它。 HTH：

<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>

Answer 3

代码中包含</script>。浏览器将其解释为javascript的结尾并回溯到HTML。要解决此问题，您可以将此字符串分为例如</sc'+'ript>。这将解决这个问题，但可能你仍然需要对脚本进行一些工作，但这是一个不同的故事。

Answer 4

您必须在不同的引号之间切换，并删除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>";

Answer 5

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

Answer 6

将脚本移动到table-element外面的头部或身体的末端。
首先添加div，然后调用脚本。您可能想在add()

<body onload='add'>

删除大括号，以创建有效的html：<div id=('" + divIdName + "')>

调用函数而不单击任何内容

6 个答案: