首页 / 知识

关于ruby on rails：是否可以在表单上以编程方式调用Javascript的onsubmit事件？

2023-04-13 14:07:00

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

在Ruby on Rails中，我试图使用form_remote_tag助手来更新div标签的innerHTML。每当相关的选择标记接收到onchange事件时，都会发生此更新。问题是<select onchange="this.form.submit();">;不起作用。 document.forms[0].submit()也没有。要获取要执行的form_remote_tag中生成的onsubmit代码的唯一方法是创建一个隐藏的提交按钮，然后从select标记中调用该按钮的click方法。这是一个有效的ERb部分示例。

1
2
3
4
5
6

<% 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 %>

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

1
2
3
4
5
6

<% 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格式如下所示：

1
2
3
4
5
6
7
8
9
10
11
12

我想砍掉不可见的提交按钮，但是使用直线形式。提交似乎不起作用。因此，我需要某种方式来调用表单的onsubmit事件代码。

更新：如果没有Rails生成的return(false);，则Orion Edwards解决方案将起作用。我不知道哪一种情况更糟，将幻像式点击发送到不可见的提交按钮，或者在用JavaScript字符串替换删除返回调用之后，在getAttribute('onsubmit')调用中调用eval！

我知道这个问题有点陈旧，但是您打算做什么呢？

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

或

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

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

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

因此，没有理由仅将函数转换为字符串即可进行评估。

为您的表格提供id。

然后

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

如果要通过innerHTML将Javascript加载到div中，它将无法运行...仅供参考。

如果必须使用Rail的内置Javascript生成，我将使用Orion的解决方案，但需要进行一些小的改动以补偿返回代码。

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

但是，从长远来看，通过将Javascript代码分离到一个外部文件或单独的可调用函数中，您将拥有一个更轻松的时间。

不要。

您有解决方法。

停止，继续到下一个功能点。

我知道，它并不漂亮，但是存在更大的问题。

不确定是否有答案，但是在选择的onclick函数中，调用onsubmit而不是submit。

理论上，类似eval ('function(){' + code + '}()');的东西可能会起作用(尽管语法失败)。即使这样做确实可行，通过select onchange调用eval仍然是一种贫民窟。另一个解决方案是以某种方式使Rails将onsubmit代码注入到select标签的onchange字段中，但是我不确定是否有这样做的方法。 ActionView具有link_to_remote，但是在onchange字段中没有明显的帮助程序来生成相同的代码。

如果您实际上不想提交表单，而只是调用onsubmit中碰巧的任何代码，则可以执行以下操作：(未经测试)