Question

我正在尝试关注这篇文章How can I unobtrusively disable submit buttons with Javascript and Prototype?，但我无法让它发挥作用。该表单触发了一个RJS函数，因此我需要保持帮助者的onclick事件不变。 RJS返回/重新加载相同的表格以及两个新文本。我真的很困惑。以下是表单的rails代码：

.span-20#comparison
  / new comparison . . .
  / voting forms (also reloaded)
  .span-4.prepend-3.append-6
    - form_remote_tag :action => url_for(:controller => :comparisons), :method => :post do
      = hidden_field_tag :poem1_id, poems[:a].id
      = hidden_field_tag :poem2_id, poems[:b].id
      = hidden_field_tag :response, 1
      = submit_tag "Vote for me", :disabled => false, :disable_with => 'Vote for me', :class => "compare"    

  .span-4.append-3.last
    - form_remote_tag :action => url_for(:controller => :comparisons), :method => :post do
      = hidden_field_tag :poem1_id, poems[:a].id
      = hidden_field_tag :poem2_id, poems[:b].id
      = hidden_field_tag :response, 2
      = submit_tag "Vote for me", :disable_with => 'Vote for me', :class => "compare"

  .span-4.prepend-8.append-8.prepend-top.last
    - form_remote_tag :action => url_for(:controller => :comparisons), :method => :post do
      = hidden_field_tag :poem1_id, poems[:a].id
      = hidden_field_tag :poem2_id, poems[:b].id
      = hidden_field_tag :response, 'draw'
      = submit_tag "Declare Draw", :disable_with => 'Declare Draw', :class => "compare"

RJS

page.replace_html :comparison, :partial => 'poems', :object => @poems
page.insert_html :top, :previous, :partial => 'comparison', :object => @comparison
page << "Effect.ScrollTo($('top'));"

Answer 1

这是使用Prototype的一种方法：

<script type="text/javascript">
  document.observe("dom:loaded" function() {
    $$("input .compare").each(function(submit) {
      submit.observe("click", function() {
        submit = true;
      });
    });
  });
</script>

这会在加载DOM时为每个带有input CSS类（即您的提交按钮）的compare元素添加一个onclick事件处理程序。 onclick事件处理程序在单击时禁用每个按钮。请注意，以这种方式使用Prototype添加事件处理程序不会替换元素上的任何现有事件处理程序。

如何禁用Rails提交按钮和原型助手＆amp; RJS？

1 个答案: