是否可以在表单上以编程方式调用 Javascript 的 onsubmit 事件?

Is it possible to call Javascript's onsubmit event programmatically on a form?

提问人:hoyhoy 提问时间:8/29/2008 最后编辑:Cœurhoyhoy 更新时间:10/11/2017 访问量:14891

问:

在 Ruby on Rails 中,我正在尝试使用帮助程序更新 div 标签。每当关联的 select 标记收到 onchange 事件时,就会发生此更新。问题是,;不起作用。也没有.获取要执行的form_remote_tag中生成的 onsubmit 代码的唯一方法是创建一个隐藏的提交按钮,然后从 select 标记调用按钮上的 click 方法。下面是一个有效的 ERb 部分示例。innerHTMLform_remote_tag<select onchange="this.form.submit();">document.forms[0].submit()

<% form_remote_tag :url => product_path, :update => 'content', :method => 'get' do -%>
  <% content_tag :div, :id => 'content' do -%>
    <%= select_tag :update, options_for_select([["foo", 1], ["bar", 2]]), :onchange => "this.form.commit.click" %>
    <%= submit_tag 'submit_button', :style => "display: none" %>
  <% end %>
<% end %>

我想做的是这样的事情,但它不起作用。

<% form_remote_tag :url => product_path, :update => 'content', :method => 'get' do -%>
  <% content_tag :div, :id => 'content' do -%>
    # the following line does not work
    <%= select_tag :update, options_for_select([["foo", 1], ["bar", 2]]), :onchange => "this.form.onsubmit()" %>
  <% end %>
<% end %>

那么,有没有办法删除此用例的不可见提交按钮?

似乎有些混乱。所以,让我解释一下。基本问题是不会调用呈现到窗体中的代码。submit()onsubmit()

Rails 从这个 ERb 呈现的实际 HTML 表单如下所示:

<form action="/products/1" method="post" onsubmit="new Ajax.Updater('content', '/products/1', {asynchronous:true, evalScripts:true, method:'get', parameters:Form.serialize(this)}); return false;">
  <div style="margin:0;padding:0">
    <input name="authenticity_token" type="hidden" value="4eacf78eb87e9262a0b631a8a6e417e9a5957cab" />
  </div>
  <div id="content">
    <select id="update" name="update" onchange="this.form.commit.click">
      <option value="1">foo</option>
      <option value="2">bar</option>
    </select>
    <input name="commit" style="display: none" type="submit" value="submit_button" />
  </div>
</form>

我想砍掉不可见的提交按钮,但使用直接的form.submit似乎不起作用。因此,我需要某种方法来调用表单的 onsubmit 事件代码。

更新:如果没有 Rails 生成,Orion Edwards 解决方案将起作用。我不确定哪个更糟,在使用 javascript 字符串替换删除返回调用后,向不可见的提交按钮发送幻影点击或在调用中调用 eval!return(false);getAttribute('onsubmit')

JavaScript Ruby-on-Rails Ruby

评论


答:

3赞 FlySwat 8/29/2008 #1

给你的表格一个.id

然后

document.getElementById('formid').submit();

如果您将 Javascript 加载到 via 中,它不会运行......仅供参考。divinnerHTML

-3赞 Orion Edwards 8/29/2008 #2

如果您实际上并不想提交表单,而只是调用 onsubmit 中碰巧出现的任何代码,您可以这样做:(未经测试)

var code = document.getElementById('formId').getAttribute('onsubmit');
eval(code);

评论

0赞 hoyhoy 9/12/2008
这在理论上是可行的,但我仍然在生产中使用我的原始代码,只是为了避免不得不使用评估。
2赞 John Millikin 8/29/2008 #3

如果你必须使用 Rail 内置的 Javascript 生成,我会使用 Orion 的解决方案,但有一个小的改动来补偿返回代码。

eval ('(function(){' + code + '})()');

但是,在我看来,从长远来看,通过将 Javascript 代码分离到外部文件或单独的可调用函数中,您会更容易。

-1赞 hoyhoy 8/29/2008 #4

从理论上讲,类似的东西可以工作(尽管语法失败了)。即使这确实有效,通过选择调用 eval 仍然是一种贫民窟。另一种解决方案是以某种方式让 Rails 将代码注入 select 标签的字段中,但我不确定是否有办法做到这一点。ActionView 已link_to_remote,但没有明显的帮助程序可以在字段中生成相同的代码。eval ('function(){' + code + '}()');onchangeonsubmitonchangeonchange

1赞 fatgeekuk 9/20/2008 #5

不要。

你有一个解决方案。

停止,转到下一个功能点。

我知道,它并不漂亮,但还有更大的问题。

0赞 taiya 1/27/2009 #6

不确定你是否有答案,但在选择函数中,调用而不是 .onclickonsubmitsubmit

5赞 ErikE 3/18/2010 #7

我意识到这个问题有点老了,但你到底在为什么呢?

document.getElementById('formId').onsubmit();
document.getElementById('formId').submit();

document.formName.onsubmit();
document.formName.submit();

当加载文档的 DOM 时,事件不再是字符串,而是函数。

alert(typeof document.formName.onsubmit); // function

因此,没有理由将函数转换为字符串,以便对其进行评估。