1

当用户单击图像区域时，我想触发并向服务器发出 ajax 请求。有没有一种简单的方法来实现这个 a-la Rails 3 UJS？类似于 link_to ..., :remote=>true 的东西？

我尝试了以下代码：

#post_bar
  =image_tag 'post_bar_270x57.png', :usemap=>'#add_post'
  %map{:name=>"add_post"}
    %area{:shape=>"rect", :coords=>"40,4,86,50", :href=>new_message_path, :'data-remote'=>'true', :title=>"Message"}

但添加的数据远程属性不起作用。

谢谢你的帮助。

4

2 回答 2

0

在尝试了几件事后，我得出结论，最简单的方法是在 png 顶部有一个 HTML 锚元素，我可以简单地使用带有 :remote=>true 的 link_to 帮助器。我花了不到 10 分钟的时间让所有的东西都正常工作。

编辑：这是我的haml文件中的代码（在生产中我删除了map元素）

#post_bar
  =image_tag 'post_bar_270x57.png', :usemap=>'#add_post'
  %map{:name=>"add_post"}
    %area{:shape=>"rect", :coords=>"40,4,86,50", :href=>new_message_path, :title=>"Message"}
    %area{:shape=>"rect", :coords=>"100,4,146,50", :href=>new_message_path, :title=>"Reminder(140 chars)"}
  #post_message_link
    =link_to "", new_message_path, :remote=>true

和CSS

#post_message_link a{
    position: absolute;
    top: 0px;
    left: 40px;
    width: 45px;
    height: 50px;
    display: block;
    z-index: 100;
}
于 2011-05-26T19:48:29.870 回答
0

在 jquery-rails gem（使用“bundle show jquery-rails”找到的路径）中，在 vendor/assets/javascripts 下有一个 jquery-ujs 的 javascript 文件。

在第 51 行，您可以看到以下内容：

// Link elements bound by jquery-ujs   
linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote], a[data-disable-with]'

我发现将 area 标签添加到这一行可以让您以与普通链接等相同的方式使用 UJS。

理想情况下，您可以通过添加另一个变量来使代码更好一些，但由于这只是一个 hack，我将它添加到现有变量中。

// Link elements bound by jquery-ujs   
linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote], a[data-disable-with]', 'area[data-confirm]', 'area[data-method]', 'area[data-remote]',
于 2011-10-20T19:35:50.973 回答