简体   繁体   English

通过Enter键提交表单,但javascript中的textarea除外?

[英]Form submit by enter key except in textarea in javascript?

I have this form where it submits by pressing enter key. 我有此表单,可以通过按Enter键提交。

I want it to function except for textarea, where it should has it usual behavior adding a new line in text-area 我希望它除textarea以外起作用,它应该具有通常的行为,在textarea中添加新行

The default behavior is that the form doesn't submit if you press enter inside a textarea as seen in the following live demo . 默认行为是,如果您在文本区域内按Enter键,则不提交表单,如以下实时演示所示 It simply adds a new row inside the textarea. 它只是在文本区域内添加了新行。 You don't need any javascript for this. 您不需要任何JavaScript。 On the other hand if the the user presses enter while inside a normal textbox the form is submitted. 另一方面,如果用户在普通文本框内按下Enter键,则提交表单。

React:如何提交表单<textarea>&lt;i&gt;with enter key and without a submit button with React Hooks?&lt;/div&gt;&lt;/i&gt;&lt;b&gt;带有回车键且没有带有 React Hooks 的提交按钮?&lt;/div&gt;&lt;/b&gt;</textarea><div id="text_translate"><p> Halo 伙计们,我对反应很陌生,我想提交一个只有文本区域的表单,并按下enter键。 我遵循了一些 SO 问题,但仍然没有运气,因为它没有被提交。 我还想在提交后清除文本区域。 我怎样才能用下面的代码做到这一点?</p><p> 这是我目前拥有的代码。</p><pre> const { register, handleSubmit, control, errors } = useForm(); const CommentOnSubmit = (data) =&gt; { let formData = new FormData(); formData.append('content', data.content); formData.append('user', user?.id); axiosInstance.post(`api/blogs/` + slug + `/comment/`, formData); }; // const commentEnterSubmit = (e) =&gt; { // if(e.key === 'Enter' &amp;&amp; e.shiftKey == false) { // return( // e.preventDefault(), // CommentOnSubmit() // ) // } // } &lt;form noValidate onSubmit={handleSubmit(CommentOnSubmit)}&gt; &lt;div className="post_comment_input"&gt; &lt;textarea type="text" placeholder="Write a comment..." name="content" ref={register({required: true, maxLength: 1000})} /&gt; &lt;/div&gt; &lt;div className="comment_post_button"&gt; &lt;Button type="submit" variant="contained" color="primary"&gt;comment&lt;/Button&gt; &lt;/div&gt; &lt;/form&gt;</pre><p> 请帮忙。</p><p> 非常感谢。</p></div> - React: How to submit a form with <textarea> with enter key and without a submit button with React Hooks?

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 在文本区域上按Enter键时如何提交表单? - How to submit a form when the Enter Key on a textarea? 使用 javascript 在 Enter 键上提交表单 - Submit form on Enter key with javascript 提交textarea表单,而没有带有Enter键的提交按钮 - Submit textarea form without a submit button with Enter key press Javascript:按Enter键提交表单 - Javascript:Block form submit on Enter Key press JavaScript:在Enter上提交表单 - JavaScript: Submit Form on Enter 输入键以使用php id乘以表单的情况下使用javascript提交表单 - Enter key to submit form with javascript in case of multiply form with php id React:如何提交表单<textarea>&lt;i&gt;with enter key and without a submit button with React Hooks?&lt;/div&gt;&lt;/i&gt;&lt;b&gt;带有回车键且没有带有 React Hooks 的提交按钮?&lt;/div&gt;&lt;/b&gt;</textarea><div id="text_translate"><p> Halo 伙计们,我对反应很陌生,我想提交一个只有文本区域的表单,并按下enter键。 我遵循了一些 SO 问题,但仍然没有运气,因为它没有被提交。 我还想在提交后清除文本区域。 我怎样才能用下面的代码做到这一点?</p><p> 这是我目前拥有的代码。</p><pre> const { register, handleSubmit, control, errors } = useForm(); const CommentOnSubmit = (data) =&gt; { let formData = new FormData(); formData.append('content', data.content); formData.append('user', user?.id); axiosInstance.post(`api/blogs/` + slug + `/comment/`, formData); }; // const commentEnterSubmit = (e) =&gt; { // if(e.key === 'Enter' &amp;&amp; e.shiftKey == false) { // return( // e.preventDefault(), // CommentOnSubmit() // ) // } // } &lt;form noValidate onSubmit={handleSubmit(CommentOnSubmit)}&gt; &lt;div className="post_comment_input"&gt; &lt;textarea type="text" placeholder="Write a comment..." name="content" ref={register({required: true, maxLength: 1000})} /&gt; &lt;/div&gt; &lt;div className="comment_post_button"&gt; &lt;Button type="submit" variant="contained" color="primary"&gt;comment&lt;/Button&gt; &lt;/div&gt; &lt;/form&gt;</pre><p> 请帮忙。</p><p> 非常感谢。</p></div> - React: How to submit a form with <textarea> with enter key and without a submit button with React Hooks? 如何在文本区域中按 Enter 时提交表单 - How to submit a form when pressing Enter in a textarea 如何在 html textarea 中使用 enter press 提交表单 - How to submit form with enter press in html textarea 使用Prototype javascript输入密钥时提交表单 - Submit form when enter key pressed using Prototype javascript
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM