如何在不将用户发送到页面顶部的情况下触发javascript playound事件？ [英] How do I fire a javascript playsound event onclick without sending the user to the top of the page?

问题描述

我的网站上的网页上有以下代码 - 当用户点击图片时会播放声音：

I have the following code on a page on my site — when the user clicks on the image a sound plays:

<script language="javascript" type="text/javascript">
 function playSound(soundfile) {
 document.getElementById("dummy").innerHTML=
 "<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
 }
 </script>
 <span id="dummy"></span>
 <div id="soundimage">
 <a href="#" onclick="playSound('sound.mp3');"><img src="image.png" /></a>
 </div>

一切都很好，但图片位于页面底部，当用户点击时图像被重定向回页面顶部。有没有办法使这个工作，以便只有一个音频变化，而不是一个视觉变化（如果这是有道理的！）？

It all works great, but the image is at the bottom of the page, and when the user clicks the image they are redirected back to the top of the page. Is there any way to get this working so that there is only an audio change, and not a visual one (if that makes sense!)?

当使用鼠标悬停功能时相反，例如

When using a mouseover function instead, such as

<a onmouseover="playSound('sound.mp3');"><img src="image.png" /></a>

用户保持在页面上的位置，但我希望他们可以选择玩点击而不是翻转的声音。

the user remains where they were on the page, but I would like them to have the option of playing the sound on click and not on rollover.

推荐答案

问题是你的href属性。 #as作为锚将其发送到页面顶部。使用

The problem is your href attribute. # as an anchor sends it to the top of the page. Use

<a href="javascript: void(0);" onclick="playSound('sound.mp3');">...</a>

此外，始终在链接中包含href属性。

Also, always include an href attribute to links.

这篇关于如何在不将用户发送到页面顶部的情况下触发javascript playound事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！