ReactJS：如何从另一个事件触发表单提交事件

  • Z时代
  • 2024-01-10
  • 分类：问答

我有两个反应事件：

  1. 表单提交事件

        sendMessage: function(event){
        console.log(event);
        event.preventDefault();
    },

  1. keyPress事件

        textareaKeypress: function(event){
        if (event.which == 13 && !event.shiftKey){
            document.getElementById('messagebox').submit();
        }
    },

但是reactJS没有捕获由触发的表单提交textareaKeypress。如何通过适当的事件调用sendMessagefrom

textareaKeypress？

回答：

我今天学到了一些新东西：这就是DOM的工作方式。

从MDN网站：

onsubmit="return

false;"从基于Gecko的应用程序中调用此方法时，不会触发表单的onsubmit事件处理程序（例如）。通常，不能保证HTML用户代理会调用它。

根据HTML规范：

submit()调用该方法时，必须form从form元素本身 元素，

。

其次是（第4.10.22.3节）

submit在 form 处引发 ，该

会冒泡并且可以取消命名。

因此，如果submit()设置了方法标志，则不会触发该事件。

通过以下代码（JSFiddle示例），我能够得到您（和我）期望的行为：

<form onSubmit={this.handleSubmit} ref="form">
  <textarea onKeyPress={this.handleKeyPress} />
</form>
// ...
this.refs.form.getDOMNode().dispatchEvent(new Event("submit"));

（您将在IE中需要更多详细的代码。）

jQuery的$(form).submit()

委托

$(form).trigger("submit")，所以我希望这是一个类似的解决方法。

以上是 ReactJS：如何从另一个事件触发表单提交事件 的全部内容， 来源链接： utcz.com/qa/417363.html

回到顶部