Javascript 如何让Soundcloud播放器使用jQuery不间断地播放页面加载？_Javascript_Jquery_Html_Ruby On Rails

Javascript 如何让Soundcloud播放器使用jQuery不间断地播放页面加载？

javascript jquery html ruby-on-rails

Javascript 如何让Soundcloud播放器使用jQuery不间断地播放页面加载？,javascript,jquery,html,ruby-on-rails,Javascript,Jquery,Html,Ruby On Rails,我想制作一个音乐博客，并在我的导航栏中嵌入一个音乐播放器。目前我正在rails中完成这项工作，我知道我可以使用JQuery来完成这项工作。不幸的是，我的植入不正确。请让我知道我做错了什么。我已经添加了我的应用程序和头文件 application.html.erb <!DOCTYPE html> 正确%> 正确%> src=”https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"> $（

我想制作一个音乐博客，并在我的导航栏中嵌入一个音乐播放器。目前我正在rails中完成这项工作，我知道我可以使用JQuery来完成这项工作。不幸的是，我的植入不正确。请让我知道我做错了什么。我已经添加了我的应用程序和头文件

application.html.erb

<!DOCTYPE html>


正确%>
正确%>
src=”https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js">      
$（文档）.ready（函数（）{
$（'#content'）.load（'home.html.erb'）；
$（'a'）。在（'click'，function（）上{
var page=$（this.attr（'href'）；
$（“#content”）.load（'static_pages/'+page+'.html'）；
返回false；
});
});

header.html.erb

  <div id = "navbar">
  <ul id = "menu-nav">


  <li class = "nav-item"> <a href= "home"  > <i class="fa fa home">   </i> Home </a> </li>
 <li class = "nav-item"> <a href= "#"> <i class="fa fa-music"></i>  Music </a> </li>

 <li class = "nav-item"> <a href= "about" >  <i class="fa fa-thumbs-up"></i>   Artist Discovery </a> </li>

 <li class = "nav-item"> <a href= "#"> <i class="fa fa-paper-plane"></i>  News </a> </li>

  <li class = "nav-item"> <a href= "#"> <i class="fa fa-heart"></i>  Alex! </a> </li>
</ul>
</div>

你能用soundcloud的东西添加JS文件吗？我没有JS文件，因为我发现外部文件运行不正常或者我的实现不正确。这就是为什么我的html文件中有脚本。我将把iframe包装成一个div，并将其添加到ul中$（document）.ready（function（）{$（'#content'）.load（'home.html.erb'）；$（'a'））.on（'click'，function（）{var page=$（this.attr（'href'）；$（“#content”）.load（'static_pages/'+page+'.html'）；返回false；}）；您的js现在将在每次页面更改时重新加载播放器，这就是您遇到这种行为的原因。我认为您应该将iframe放在布局中，这样它就不会被刷新，或者将JS对象设置为document.window上的变量。

  <div id = "navbar">
  <ul id = "menu-nav">


  <li class = "nav-item"> <a href= "home"  > <i class="fa fa home">   </i> Home </a> </li>
 <li class = "nav-item"> <a href= "#"> <i class="fa fa-music"></i>  Music </a> </li>

 <li class = "nav-item"> <a href= "about" >  <i class="fa fa-thumbs-up"></i>   Artist Discovery </a> </li>

 <li class = "nav-item"> <a href= "#"> <i class="fa fa-paper-plane"></i>  News </a> </li>

  <li class = "nav-item"> <a href= "#"> <i class="fa fa-heart"></i>  Alex! </a> </li>
</ul>
</div>