0

我有以下场景..

当用户访问我的网站时，我会向用户展示一些来自服务器的音频文件。当用户单击一个链接时，最终会执行 jquery 函数并将嵌入对象的源更改为所选文件。

我的脚本是：

<script type="text/javascript">
    $("#song").click(function(){
        var src=$(this).attr("href");
        var plyr=document.getElementById("mplayer");
        var clone=plyr.cloneNode(true);
        clone.setAttribute('src',src);
        plyr.parentNode.replaceChild(clone,plyr)
    });
</script>

链接以选择音频文件。

  <a href="resources/songs/xx21.mp3" id="song">

xx21

对象是

<div id="music">
    <embed type="audio/mpeg" src="#" name="plugin" height="100%" width="100%" id="mplayer">
</div>

发生在我身上的是，当我点击链接时。歌曲在新页面播放。我需要在div music.

4

2 回答 2

1

如果您有多个可以加载歌曲的链接，请使用类而不是 id，因为每个 id 在页面上应该是唯一的。然后您可以执行此操作以将嵌入的 src 更改为单击的链接的 href：

$('.song').on('click', function(e) {
    $('#mplayer').attr('src', $(this).attr('href'));
    e.preventDefault();
});

e.preventDefault()将阻止您的浏览器尝试转到文件的位置。

于 2013-02-19T10:38:33.433 回答
0

您需要阻止元素的默认执行。链接的默认执行是 - 打开链接。

你可以做什么：

要么<a href="link-to-sound" onClick="return false;">或

<script type="text/javascript">
$(".song").click(function(event){
event.preventDefault();
var src=$(this).attr("href");
var plyr=document.getElementById("mplayer");
var clone=plyr.cloneNode(true);
clone.setAttribute('src',src);
plyr.parentNode.replaceChild(clone,plyr)
});
</script>

你需要添加event.preventDefault()

于 2013-02-19T10:41:10.630 回答