ruby-on-rails – 将Ruby字符串插值为ID_语言综合

概述我正在尝试掌握插值,并尝试使用动态字符串(我说动态,因为它可以一直改变,我通过屏幕刮取电影版本拉日期)和作为ID,以便我可以使用bootstrap scrollspy in我的项目我使用传统的ID和锚标签创建了a js fiddle,它展示了我想要实现的目标. 正如你所看到的,我想展示一部电影的发行日期,如果我在该部分内,因为我正在滚动. 我的代码看起来像这样： <div class="cont 我正在尝试掌握插值,并尝试使用动态字符串(我说动态,因为它可以一直改变,我通过屏幕刮取电影版本拉日期)和作为ID,以便我可以使用bootstrap scrollspy in我的项目

我使用传统的ID和锚标签创建了a js fiddle,它展示了我想要实现的目标.

正如你所看到的,我想展示一部电影的发行日期,如果我在该部分内,因为我正在滚动.

我的代码看起来像这样：

<div > <div >  <div >   <div ID="dateNav">    <ul >      <li><a href="##{date}"></a><% @response.each_pair do |date,movIE| %><%= link_to date_format(date) %><% end %></li>   </ul>   </div>  </div> </div></div><div > <% @response.each_pair do |date,movIE| %>  <h3  ID="<%= date %>">Available on&nbsp;<%= date_format(date) %></h3></div><!-- More movIE information here<% end %>

我的身体就像这样

<body data-spy="scroll" data-target="#dateNav">

我正在调用scrollspy

$('.dateNav').scrollspy()

当您在相关部分时,应该显示日期

CSS

ul.dateNav ul li a { display:none;}ul.dateNav ul > li.active > a{display:blockcolor: red;text-decoration: underline;}

但是,当向下滚动页面时,日期不会出现.

任何帮助表示赞赏,真的想澄清一些理解.

谢谢

编辑

好的,所以改变了Joe Pym的建议

<li><% @response.each_pair do |date,movIE| %><%= link_to date_format(date),"##{date}" %><% end %></li>

现在每个日期都有自己的ID,之前没有发生过,但仍然没有出现相关日期

HTML现已生成

<ul > <li> <a href="#2013-01-09">9th Jan 2013</a> <a href="#2013-01-11">11th Jan 2013</a> <a href="#2013-01-18">18th Jan 2013</a> <a href="#2013-01-23">23rd Jan 2013</a> <a href="#2013-01-25">25th Jan 2013</a> <a href="#2013-01-30">30th Jan 2013</a> </li></ul>

编辑萨拉

调用scrollspy

$('#spyOnThis').scrollspy();

导航日期

<div > <div >  <div >   <div ID="dateNav">    <ul >      <li><% @response.each_pair do |date,"#d_#{date}" %><% end %></li>    </ul>   </div>  </div></div>

电影列表

<div ID="spyOnThis">  <% @response.each_pair do |date,movIE| %>    <h3  ID="d_<%= date %>">Available on&nbsp;<%= date_format(date) %></h3>    <% movIE.each do |m| %>      <div >        <img  src=<% if m.image_link %> <%= m.image_link %> <% else %> "/assets/noimage.jpg" <% end %>>        <div >          <%= link_to m.name,m.Title_ID,:class => 'resultTitle FontSize11' %>          <p ><%= m.bio %></p>          <p >Cast</p>          <p ><%= m.cast.join(",") unless m.cast.empty? %></p>          <%= link_to "Remind me",reminders_path(:Title_ID => m.Title_ID),:method => :post,:class => 'links button' %>        </div>      </div>    <% end %>  <% end %>  </div>

CSS

#spyOnThis { height:auto; overflow:auto;}

我将高度设置为自动,因为结果的数量每次都会改变

ul.dateNav > li.active > a {display:block;color: red;text-decoration: underline;}

解决方法以数字开头的ID无效. Source

尝试将字符串常量添加到每个ID的开头.

<a href="#d_#{date}"></a>

和

<h3  ID="d_<%= date %>">

免责声明：我不知道Ruby.

编辑

好的,所以我把它剥掉了,让它运转起来. jsFiddle

为了小提琴的目的,我改变了你的一些类和ID(也似乎有一些关于.dateNav和#dateNav的混淆),但它看起来应该是这样的：

<ul >  <li>    <a href="#d_#{date}"><% @response.each_pair do |date,movIE| %><%= link_to date_format(date) %><% end %></a>  </li></ul>

和

<div >  <% @response.each_pair do |date,movIE| %>  <h3  ID="d_<%= date %>">Available on&nbsp;<%= date_format(date) %></h3></div>

你可以把ID放在div上(比如小提琴)或h3,这没关系.重要的部分是CSS以及如何启动ScrollSpy.

如果你用JavaScript调用它($(‘#spyOnThis’).scrollspy()),你需要将它附加到要触发滚动事件的元素 – 而不是跟踪的菜单. Source
此外,您应该从body元素中删除data-spy和data-target.

最后但并非最不重要的是,您调用.scrollspy()的元素需要有一个高度和溢出：auto;为插件设置以跟踪滚动位置.

总结

以上是内存溢出为你收集整理的ruby-on-rails – 将Ruby字符串插值为ID全部内容，希望文章能够帮你解决ruby-on-rails – 将Ruby字符串插值为ID所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/langs/1290128.html

ruby-on-rails – 将Ruby字符串插值为ID

发表评论

评论列表（0条）