Question

我正在尝试修改特定div的innerHTML，但我无法删除div的内容。我有以下代码：

<!DOCTYPE html>
<html>
    <head>
        <title>Test</title>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    </head>
    <body>
        <script type="text/javascript">
            function reset() {
                document.getElementById("results").innerHTML = "";
            }
            function check () {
                document.getElementById("results").innerHTML = "foo";
            }
        </script>
        <form name="form1">
            <input type="button" value="Check" onclick="check();">
            <input type="button" value="Reset" onclick="reset();">
        </form>
        <div id="results"></div>
    </body>
</html>

有人能指出我做错了吗？

提前致谢。

Answer 1

那是因为表单中已经有reset函数，而且这个函数被调用而不是你自己的函数。更改该名称即可。

    <script type="text/javascript">
        function r2() {
            document.getElementById("results").innerHTML = "";
        }
        function check () {
            document.getElementById("results").innerHTML = "foo";
        }
    </script>
    <form name="form1">
        <input type="button" value="Check" onclick="check();">
        <input type="button" value="Reset" onclick="r2();">
    </form>
    <div id="results"></div>

Demonstration

这种问题是避免内联函数调用的另一个原因。首选方式是

 <form name="form1">
        <input type="button" value="Check" id=check>
        <input type="button" value="Reset" id=reset>
 </form>
 <div id="results"></div>
 <script type="text/javascript">
       document.getElementById("reset").onclick = function() {
            document.getElementById("results").innerHTML = "";
       }
       document.getElementById("check").onclick = function(){  
           document.getElementById("results").innerHTML = "foo";
       }
</script>

Answer 2

提供

onclick="window.reset();"

无法修改div的innerHTML

2 个答案: