如何通过jQuery更改对象嵌入源 [英] how to change object embed source via jquery

问题描述

我有以下情况.

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

When the user visit my website I show the user some audio files from the server. When the user clicks on one link, then the jquery function is eventually executed and change the source of the embedded object to selected file.

我的脚本是:

<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中播放带有嵌入对象的歌曲.

What happening for me is, When I click on the link. The song plays in new page. I need to play the song with embedded object inside the div music.

推荐答案

如果您有多个链接将加载一首歌曲，请使用类代替ID，因为每个ID在页面上都是唯一的.然后，您可以执行以下操作将嵌入的src更改为被单击的链接的href:

If you have more than one link that will load a song, use a class instead of an id, as each id is supposed to be unique on the page. Then you can do this to change the src of the embed to the href of the link that is clicked:

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

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

e.preventDefault() will prevent your browser from trying to go to the location of the file.

这篇关于如何通过jQuery更改对象嵌入源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！