[AWDwR4] Iteration F4

  直接参照链接 section-11.4 来做
  在app/views/line_items/create.js.erb 中使用jQuery语句来产生渐变显示。

 if($('#cart tr').length == 1) { $('#cart').show('blind', 1000);}    

    可以使用JavaScript lint  在线检查JavaScript的语法对不对。
    注意此时的语法是jQuery的语法,而书上的create.js.rjs是在服务器端进行处理之后才生成JavaScript语句的,所以可以使用成员变量 @cart.total_items。而我们使用jQuery而不是Prototype/Rjs时,只能利用客户端的Javascript语句来判断是否需要渐变显示。当 id为cart的tag中tr只有一个时,@cart.line_items.empty?==true的时候,这个时候cart里面只有一个tr,用来显示总价的。
      在 app/views/layouts/application.html.erb中

 <%= hidden_div_if(@cart.line_items.empty?, id: 'cart') do %>    
         <%= render @cart %>
 <% end %>

        hidden_div_if 是定义在app/helpers/application_helper.rb中的函数,它产生一个id为cart的div,如果@cart.line_items.empty成立,这个div的display属性为none,即不显示这个div。这样整体效果是当@cart.line_items.empty时,cart是隐藏了的,此时单击Add to cart,客户端收到服务器端的javascript代码(create.js.erb ),由于满足$('#cart tr').length == 1,所以cart会进行渐变显示,同时会执行$('#cart').html('<%= escape_javascript(render(@cart)) %>');来更新cart。

回到本系列的目录

posted on 2012-11-06 20:21  生栋  阅读(222)  评论(0编辑  收藏  举报

导航