javascript - 为什么我的 onclick""不起作用？

Question

免责声明:不要担心我的代码是否“符合标准”

基本上，我正在制作的页面应该在使用<object data="someAudio.wav">加载时播放一个简短的音频剪辑。标签。然后，我使用 Javascript 和 setTimeout() 在几秒钟的延迟后播放其他几个音频文件。 setTimeout 通过使用innerHTML 并使用新对象重写正确的div 部分来实现此目的，其中该对象只是另一个音频。例如:

<script type="text/javascript">
setTimeout("update_audio()", 2500);

function update_audio(){
    document.getElementById('slide_audio').innerHTML="<object classid='clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95' height='0' width='0'><param name='FileName' value='../../../Audio_general/good.wav'><param name='autoplay' value='true'><object type='audio/mpeg' height='0' width='0' data='../../../Audio_general/good.wav'><param name='controller' value='true'><param name='autoplay' value='false'></object></object>";
}
</script>

我将图像链接到 map ，以便将其分为 4 个部分。当我单击某个部分时，它将调用一个函数，该函数将根据我的选择执行逻辑，然后播放其他 2 个音频文件中的 1 个。 map 代码部分在这里:

<map id="testing_image" name="pictureMap">
    <area id="image1" shape="rect" coords="0, 0, 449, 331"  onclick="evaluate_status(1);" onmouseover="this.style.cursor='pointer'" alt="FB">
</map>

我的问题是 onclick="evaluate_status()" map 的某些部分仅在我更新innerHTML 之前才起作用。意思是，如果我可以在 2.5 秒之前单击某个部分(第一次innerHTML 更新)，它将播放正确的音频。但是，在使用innerHTML 更新div 部分后，我的 map 的所有onclicks 都不起作用。我很困惑为什么会这样，因为只改变了一小部分。

谁能帮我弄清楚为什么 onclicks 不起作用以及如何修复它？我对网页设计还很陌生，确实需要帮助。谢谢!

Answer 1

您缺少结束语 </div>标签 slide_audio ，因此testing_image事实上是 slide_audio 的 child 并在脚本运行时被新对象替换。

如果您在禁用 JavaScript 的情况下查看 Firebug，您将能够看到 testing_image在里面slide_audio ，不与其分离。以下是该网站上 Chrome 开发者工具的屏幕截图: