logo标签列表

JavaScript的“onClick”事件

javascriptdom-events
3

我有一个PHP文件中的这行代码：

echo "<input type='button' id='showButton' value='show'  onclick='showOld()'>";

该函数位于外部JS文件中。 函数声明如下：

页面中的其他onclick事件和JS函数都能够正常工作。

function showOld()
{
alert("njkh");
var table = document.getElementById("showExp");
var button = document.getElementById("showButton");
if (table.style.display == "none")
{
    table.style.display = "inline";
    button.value = "הסתר ניסויים ישנים";
}
else if (table.style.display == "inline")
{
    table.style.display = "none";
    button.value = "הצג את כל הניסויים";
}       
}

控制台显示：

"引用错误：showOld未定义"

也许一些Javascript代码有问题。我在HTML中没有发现任何错误。请同时发布JS代码或在http://jsfiddle.com上创建一个fiddle。 - Akos
6
请编辑问题，添加您的 JavaScript 代码，用于函数showOld()。 - Shef
1
外部JS文件包含在哪里？它应该在输入按钮之前被包含，以便该函数可用。还要检查拼写。如果您有Firefox和Firebug，请打开控制台并刷新以查看是否出现任何异常。 - T. Junghans
1
@TJ - 这不正确。showOld()只有在点击后才会被调用或引用（因为它作为一个字符串传递，直到点击时才会被评估），所以它不必放在输入按钮之前。 - jfriend00
当我将声明从JS文件底部移动到不同位置时，问题得到解决。然而，在IE浏览器上仍会出现“对象错误”消息。 - itamar
4个回答
5

您必须确保您的更新代码已经部署。

您可以检查HTML源代码。

并且您发布的代码没有任何问题。

2
尝试打开Firebug的控制台（或Chrome开发工具）并检查是否有任何脚本错误。
应避免编写内联JavaScript。这使得调试和维护代码库更加困难。我建议您阅读以下关于JavaScript事件的文章： Quirksmode - 早期事件处理程序 Quirksmode - 传统事件注册模型 引用文章中的一句话：
尽管内联事件注册模型是古老而可靠的，但它有一个严重的缺点。它要求您在XHTML结构层中编写JavaScript行为代码，这是不合适的。
1

首先，简化问题，看看以下函数是否有效。

function showOld() {
alert('test');
}
我尝试了，但仍然不起作用。控制台显示“showOld未定义”。 - itamar
1
尝试在'<body>'标签内定义此函数。 - OpenGG
1

尝试下一步检查异常：

<input type='button' id='showButton' value='show' onclick='javascript:alert(1);try{showOld()}catch(e){alert(e)}' />

如果有的话，JavaScript控制台会显示什么内容？

嗨。alert（）正常工作，控制台显示“showOld”未定义。 - itamar
如果控制台显示“showOld未定义”，而showOld已经被定义并加载到浏览器中，则说明showOld被闭包隐藏了，例如：_function() { function showOld(){} }_。更新您的帖子并添加showOld函数声明代码。 - Andrew D.
当我将声明从JS文件底部移动到不同的位置时，问题得到了解决。 - itamar
@itamar，根据你的showOld代码，你的.js文件包含希伯来字母。你的.js文件是用UTF8或Unicode或其他编码方式编码的吗？当你使用SCRIPT加载.js文件时，你是否正确指定了_charset_属性？ - Andrew D.
感谢您的帮助。已经指定了字符集属性。现在在Firefox上运行良好，但在IE上出现“对象错误”消息。 - itamar
打开IE开发者工具窗口（IE8+）。点击“开始调试”按钮并检查：哪一行在控制台中抛出了“对象错误”的错误。 - Andrew D.
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接