ruby-on-rails-3 - Rails link_to 和 audio_tag

Question

当我在 Rails 中使用 link_to 标签时，我试图找出在后台播放 wav 文件(类似 HTML5)的最佳方式。

这是我的一个观点中的示例 link_to:

<%= link_to 'At Station', at_station_mdt_index_path, :class => 'btn btn-success btn-medium', :method => :put, :remote => true %>

我想弄清楚如何使用 audio_tag 在按下按钮时触发声音。我试过在 link_to ERB 中组合 audio_tag 但得到各种语法错误。

任何例子将不胜感激。

更新时间 01/04/14-10:18am CT:声音发出一次且正确。但是，由于将 :id 添加到 link_to 链接不再触发 rails 路径来更改对象，只会播放声音

查看代码:

    <%= link_to 'En Route', en_route_mdt_index_path(:call_id => call.id), :class => 'btn btn-warning btn-medium', :method => :put, :remote => true, :id => "er" %>
            <%= link_to 'On Scene', on_scene_mdt_index_path(:call_id => call.id), :id => 'to', :class => 'btn btn-primary btn-medium', :method => :put, :remote => true, :id => "os"  %>
            <%= link_to 'To Hospital', to_hospital_mdt_index_path(:call_id => call.id), :class => 'btn btn-warning btn-medium', :method => :put, :remote => true, :id => "to" %>

 <audio id="en-route" class="audio_player" preload="true">
    <source src="audios/en-route.wav" type="audio/wav">
</audio>

<audio id="on-scene" class="audio_player" preload="true">
    <source src="audios/on-scene.wav" type="audio/wav">
</audio>

<audio id="to-hospital" class="audio_player" preload="true">
    <source src="audios/to-hospital.wav" type="audio/wav">
</audio>

<script>
$('#er').click(function (e) {
    e.preventDefault();
    $('#en-route')[0].currentTime = 0;
    $('#en-route')[0].play();
    return true;

});

$('#os').click(function (e) {
    e.preventDefault();
    $('#on-scene')[0].currentTime = 0;
    $('#on-scene')[0].play();
    return true;

});

$('#to').click(function (e) {
    e.preventDefault();
    $('#to-hospital')[0].currentTime = 0;
    $('#to-hospital')[0].play();
    return true;

});
</script>

Answer 1

下面是一个播放 wav 文件的简单示例:

http://jsfiddle.net/84pav/

HTML:

<a href="javascript:void(0)" id="playsound">At Station</a>

<audio id="sound_effect" class="audio_player" preload="auto">
    <source src="http://www.villagegeek.com/downloads/webwavs/alrighty.wav" type="audio/wav">
</audio>

JavaScript:

$('#playsound').click(function (e) {
    $('#sound_effect')[0].currentTime = 0;
    $('#sound_effect')[0].play();
    return false;
});

我设置了 currentTime = 0在播放之前使其始终从头播放。

它不适用于 IE，因为 IE 不支持 wav 文件。