Question

我正在使用Notepad ++，我确信它在将不同文件链接到主HTML文件时有效。这是我使用的HTML代码：

    <link rel="stylesheet" type="style/css" href="adventure.css"></link>
    <script src="adventure.js"></script>
</head>
<body>
    <button onclick=log("testing")>Click Me</button>
    <div id="box">
        <div id="out"></div>
    </div>
</body>

这是JavaScript代码：

function Gid(id) {
return getElementById(id);
}
function log(s) {
    Gid("out").innerHTML = s + "<br>" +
    Gid("out").innerHTML;
}

div的CSS

#box {
    width:500px;
    height:300px;
    border:5px solid black;
    overflow:auto;
}
#out {
    width:500px;
}

请帮我弄清楚它为什么不起作用。

Answer 1

你必须在onclick事件上调用函数：

的onclick =＆＃34;日志（＆＃39;测试＆＃39;）＆＃34;

你还必须使用

return document.getElementById（id）;

在Gid功能中

是的。

Answer 2

评论及其他答案已涵盖这些问题。

当您使用jQuery标记此问题时，这里是更简单的jQuery等价物：

<强> HTML：

<body>
    <button id="testme">Click Me</button>
    <div id="box">
        <div id="out"></div>
    </div>
</body>

<强>代码：

// Listen for click on the id="testme" button
$('#testme').click(function(){
     // $('#out') is a jquery wrapped version of the id="out" div
     var $out = $('#out');
     // jQuery html reads/or writes innerHTML depending on parameters
     $out.html("testing" + "<br/>" + $out.html()); 
});

如果脚本在它在页面中访问的元素之前，则需要将其包装在DOM就绪处理程序中：

$(function(){
    // Listen for click on the id="testme" button
    $('#testme').click(function(){
         // $('#out') is a jquery wrapped version of the id="out" div
         var $out = $('#out');
         // jQuery html reads/or writes innerHTML depending on parameters
         $out.html("testing" + "<br/>" + $out.html()); 
    });
});

注意：$(function(){});只是$(document).ready(function(){});

的便捷快捷方式

Answer 3

您需要执行两项更新。首先，替换这一行：

<button onclick=log("testing");>Click Me</button>

这一行：

<button onclick="log('testing'); return false;">Click Me</button>

这会阻止您在单击按钮时回发页面。然后替换这一行：

return getElementById(id);

这一行：

return document.getElementById(id);

因为那里没有任何有效的上下文。

Answer 4

尝试调用函数onclick =“log（'testing'）”这样它可能会起作用

Javascript无法使用HTML外部链接

4 个答案: