我想在不重新加载页面的情况下更改 <audio> 的值

Question

我正在为个人网络应用程序使用 rails 4 和 javascript。这是问题所在： 当我点击<button> 时，我想随机更改<audio> 的值。 为了生成<audio> 的路径，我使用了一个ruby 函数，它从数据库中返回声音的值。我想做的是单击<button>，每次单击它时，<audio> 的值都会更改而无需重新加载页面。 这是和示例：

<button> Click me!</button>
<audio><source src="<%= $soundpath %>"></audio>
/* I click on the button and the sound path into src="" should change everytime i click on the button without reloading the page*/
<audio><source src="<%= $soundpath %>" <--[this should be different from the previus one]></audio>

Answer 1

使用 jquery 的 AJAX 函数请求一个 URL，该 URL 将响应文本以将 src 设置为：

在您的 javascript 文件中：

$("button").click(function() {
  $.get( "/sounds/next_source", function( data ) {
    $( "audio" ).attr( "src", data );
  });
}

然后确保您为此操作设置了路由，然后在控制器中实现它：

def next_source
    @src = Sound.last.url

  respond_to do |format|
    format.html {render :plain => @src }
  end
end