JavaScript的力量发挥的声音，而不是下载

我最近做了一个音板约炉边，但是当我点击卡（图）在我的本地能够起到的声音（如预期），而当我点击在我的在线主机上的卡（图片）下载文件。JavaScript的力量发挥的声音，而不是下载

有没有办法确保它始终播放声音？

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.card').click(function(){ 
      $('#wrap').html('<embed id="embed_player" src="'+$(this).attr('name')+'" autostart="true" hidden="true"></embed>'); 
     }); 
    }); 
</script> 
<div id="pictures">  
    <img name="media/Sir-finly.mp3" src="media/Sir finly.gif" class="card"  id="sir-finly" alt="" /> 
    <img name="media/ShifterZerus.mp3" src="media/ShifterZerus.gif" class="card" id="shifterzerus" alt="" /> 
    <div id="wrap"></div> 
</div>

希望你们能帮助我。

来源

2017-02-15 djquinn

是添加这个头的服务器：'Content-Disposition：attachment'？它会强制下载（与之相反的是'Content-Disposition：inline'。只是为了好奇，为什么不使用'

这并不是我在控制台上看到的，使用这个而不是音频标签，是因为我的老师说，当我在我们学习JavaScript这样的东西的时候，这样做会更好。 – djquinn

它是有争议的，用'audio'你将被限制在HTML5支持，而'embed'似乎已经被遗留下来了，并且从来没有在不同的浏览器中以一种独特的标准方式实现（但它的支持仍然存在）。从未使用'embed'，所以我不能确定它。 – Kaddath

您可以使用音频标签，而不是嵌入。
实施例：http://codepen.io/anon/pen/LxaLMO

HTML

<div id="pictures">  
<img name="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg" src="http://megaicons.net/static/img/icons_sizes/8/178/256/numbers-1-filled-icon.png" class="card"  id="sir-finly" alt="" /> 
<img name="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(2).ogg" src="http://www.freeiconspng.com/uploads/number-2-two-icon-13.png" class="card" id="shifterzerus" alt="" /> 
<audio id="player" src="" autoplay></audio>

$(document).ready(function() { 
    $('.card').click(function(){ 
     $('#player').attr('src', $(this).attr('name')); 
    }); 
});

文档：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio

来源

2017-02-15 11:28:38

This有助于它不再下载文件，但我的浏览器仍然不会播放该文件是因为我使用歌剧还是它必须做的东西与托管，甚至是代码？ – djquinn

@djquinn你用什么版本的歌剧？你可以看到音频标签的浏览器兼容性[这里]（https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio）。在其他浏览器中尝试。如果它不起作用，这可能是您的托管服务提供商的问题。 –

我现在在一些不同的浏览器中测试过该网站，结果在每个浏览器中都是一样的。我想问题在于我的托管，因为它在我的本地主机上工作。 – djquinn

JavaScript的力量发挥的声音，而不是下载

回答

相关问题