Rails源码研究之ActionView:四，javascript_helper

跟模板中JavaScript相关的helper方法定义文件有javascript_helper.rb/prototype_helper.rb/scriptaculous_helper.rb
其中javascript_helper与基本的JavaScript功能有关，prototype_helper与Ajax有关，而scriptaculous_helper与controls和visual effects有关

先看看javascript_helper.rb中定义的一些helper方法:
1，link_to_function方法为a标签触发onclick事件提供helper方法，可以直接写JavaScript语句或者给出代码block

def link_to_function(name, *args, &block)
  html_options = args.last.is_a?(Hash) ? args.pop : {}
  function = args[0] || ''
  html_options.symbolize_keys!
  function = update_page(&block) if block_given?
  content_tag(
    "a", name, 
    html_options.merge({ 
      :href => html_options[:href] || "#", 
      : onclick => (html_options[: onclick] ? "#{html_options[: onclick]}; " : "") + "#{function}; return false;" 
    })
  )
end

例子:

link_to_function "Greeting", "alert('Hello world!')"

#  <a onclick="alert('Hello world!'); return false;" href="#">Greeting</a>

link_to_function(image_tag("delete"), "if (confirm('Really?')) do_delete()")

#  <a onclick="if (confirm('Really?')) do_delete(); return false;" href="#">
#  <img src="/images/delete.png?" alt="Delete"/>
#  </a>

link_to_function("Show me more", nil, :id => "more_link") do |page|
  page[:details].visual_effect  :toggle_blind
  page[:more_link].replace_html "Show me less"
end

#  <a href="#" id="more_link" onclick="try {
#    $("details").visualEffect("toggle_blind");
#    $("more_link").update("Show me less");
#  } 
#  catch (e) { 
#    alert('RJS error:\n\n' + e.toString()); 
#    alert('$(\"details\").visualEffect(\"toggle_blind\");
#    \n$(\"more_link\").update(\"Show me less\");');
#    throw e 
#  };
#  return false;">Show me more</a>

2，button_to_function方法为button触发onclick事件提供helper方法，可以直接写JavaScript语句或者给出代码block

def button_to_function(name, *args, &block)
  html_options = args.last.is_a?(Hash) ? args.pop : {}
  function = args[0] || ''
  html_options.symbolize_keys!
  function = update_page(&block) if block_given?
  tag(:input, html_options.merge({ 
    :type => "button", :value => name, 
    : onclick => (html_options[: onclick] ? "#{html_options[: onclick]}; " : "") + "#{function};" 
  }))
end

例子:

button_to_function "Greeting", "alert('Hello world!')"

button_to_function "Delete", "if (confirm('Really?')) do_delete()"

button_to_function "Details" do |page|
  page[:details].visual_effect :toggle_slide
end

button_to_function "Details", :class => "details_button" do |page|
  page[:details].visual_effect :toggle_slide
end

3，javascript_tag方法返回一个JavaScript标签

def javascript_tag(content, html_options = {})
  content_tag("script", javascript_cdata_section(content), html_options.merge(:type => "text/javascript"))
end

例子:

javascript_tag "alert('All is good')"

#  <script type="text/javascript">
#  //<![CDATA[
#  alert('All is good')
#  //]]>
#  </script>

本质上都是使用content_tag或tag方法来生成html标签，然后加上一些html_options的修饰，非常简单，却又非常实用