Rails每周一题(九): Ajax调用和javascript执行

  本题讲述Rails处理Ajax返回中的javascript的几种方法：

 

1. html.erb中的javascript代码。

 

    Javascript代码嵌于<script>的tag中。javascript代码会在客户端被执行（执行之后并不保留源码，对于下述几种方法也一样）。

 

 

2. js.erb中的javascript代码

 

    Javascript代码直接写于js.erb文件中，不需要<script> tag。Render这个文件，文件中的javascript代码会在客户端被执行。注意，这里的请求必须是ajax调用，即request.xhr?应该为true。否则程序会报错，提示找不到相应的erb文件。因为如果为非ajax调用，程序默认会去找html.erb文件，而非js.erb文件。

 

3. RJS

 

    RJS的本质是使javascript的编写更加简单方便，用ruby代码直接代替javascript代码的编写。这就好比form_tag这些helper方法用于简化html代码的编写一样。

 

    比如下面这段代码：

 

 

render :update do |page|  
  page.insert_html :bottom, 'strip', :partial => 'strip'  
  page.visual_effect :highlight, 'strip'  
  page.replace_html 'flash_message', :partial => 'flash_message' 
end 

  

    这段代码做了三件事情：a. 在id为strip的html下面插入由strip这个partial render出来的html代码。b. 高亮显示以strip为id的html。c. 用由flash_message这个partial渲染出来的html替换页面中flash_message为id的html。

 

    本质上，上面这段代码只是生成了一段javascript代码。经过观察，如果你采用了jquery，那么这段javascript代码被包含在一个try {} catch {}的结构中。它会在客户端被eval。

 

    如果没有rjs这样的支持，直接用javascript编写这段代码的难度不言自明。当需要一个调用触发多个客户端更新时，就应该考虑使用rjs。

 

    注意，如果你是用link_to_remote发起这个调用，那么请去掉它的参数:update。否则这段javascript代码不会被执行，而是被当做html代码被更新在:update所指定的位置。

 

 

最后：

 

   记住一句话，Ajax take away the control of HTTP from the browser。