我是网络开发的新手。我有一个代码应该在单击图像时更改图像，并在释放时将图像更改回原样。它还计算它被点击的次数。我在 Safari 上构建和测试这段代码，没有遇到任何问题。它在 Safari 上按预期工作。但是它不适用于 Chrome 和 IE(我没有测试过任何其他浏览器)。
我通常使用 HTML5 样板，但我减少了代码以便可以在此处显示(此版本也不起作用)。
我已经给出了下面页面的代码。我应该怎么做才能让它在每个浏览器上工作。它在浏览器上表现不同的原因是什么？
提前致谢
<!html>
<html>
<head>
<title></title>
<script type="text/javascript">
var count = 0;
function incrementCount()
{
count++;
document.getElementById( "count").innerHTML = count;
}
function pushTheButton()
{
document.images("bigRedButton").src = "img/pressed.gif";
return true;
}
function releaseTheButton()
{
document.images("bigRedButton").src = "img/unpressed.gif";
return true;
}
</script>
</head>
<body>
<div role="main">
<p>
<img src = "img/unpressed.gif" name="bigRedButton" onmousedown="pushTheButton()" onmouseup="releaseTheButton()" onclick="incrementCount()"/>
</br>
Click Count:<p id="count">0</p>
</p>
</div>
</body>
</html>
最佳答案
在 Chrome 中进行测试时，请记住使用其 JavaScript 控制台来观察错误。在这种情况下，它返回以下内容:
未捕获类型错误:对象 # 的属性“图像”不是函数
您的问题出在第 18 行和第 24 行，当您尝试访问 document.images("bigRedButton") 时——document.images 是一个数组(或可能是一个对象)，而不是一个函数。应该是:
文档.图像["bigRedButton"].src
我不知道为什么它在 Safari 上有效。
关于浏览器之间的javascript鼠标事件兼容性问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10000775/