按下enter键时不要刷新页面

I'm having some problems with the enter key triggering a refresh of the page whenever there is input in a form.

每当表单中有输入时，enter键就会触发页面刷新，这给我带来了一些问题。

The following code does not refresh the page if enter is pressed and if there is no text inputted in the text area (#input) but will refresh the page if enter is pressed and there is input in #input OR if the cursor is in the text area. I'm not sure what's triggering it, as #submit is a regular button.

如果按下enter，如果文本区域(#input)中没有输入文本，则以下代码不会刷新页面，但如果按下enter，并且#input中有输入，或者光标在文本区域中，则会刷新页面。我不确定是什么触发了它，因为#submit是一个常规按钮。

<div id="forms" class="container">
            <form>
                Enter your verb here in plain (dictionary) form:
                <input type="text" class="input-sm" id="input"></input>
                <div class="radio">
                    <label>
                        <input type="radio" name="input-method" value="Hiragana" checked />Radio 1
                    </label>
                </div>
                <div class="radio">
                    <label>
                        <input type="radio" name="input-method" value="Romaji" />Radio 2
                    </label>
                </div>
                <input type="button" class="btn btn-default" id="submit" value="Submit">
                </input
            </form>
        </div>

I'm trying to jquery to solve the problem, but need help in that regard. Any suggestions would be appreciated!

我正在尝试jquery来解决这个问题，但这方面需要帮助。如有任何建议，我们将不胜感激!

3 个解决方案

#1

you can either add following script at the end of body

您可以在正文末尾添加以下脚本

<script>
        $("form").submit(function (e) {
            e.preventDefault();
            alert("call some function here");
        });
</script>

or you can just put your form tag like this

或者你可以把表单标签放在这里

<form onsubmit="return false">

either way you will then have to write an onClick="SOMEFUNCTION()" to the input

无论哪种方式，都必须在输入中写入onClick="SOMEFUNCTION()"

also there is an error with an extra /button tag...remove that and instead use

另外还有一个附加/按钮标签的错误……删除它，然后使用它

<input type="button" class="btn btn-default" id="submit" value="Conjugate" />

note the ending slash

注意结束削减

#2

simply change your html:

只是改变你的html:

<div id="forms" class="container">
        <form action="javascript:void(-1)">
            Enter your verb here in plain (dictionary) form:
            ....

jsfiddle here - works like charm

jsfiddle -就像魅力一样

#3

you have syntax error in your html codes:

您的html代码有语法错误:

<input type="button" class="btn btn-default" id="submit" value="Submit">
            </button>

change it to this:

改成这样的:

 <button type="button" class="btn btn-default" id="submit" value="Submit">
            </button>

Also, you need using Javascript/jquery to submit your form to prevent refreshing your entire page

此外，还需要使用Javascript/jquery提交表单，以防止刷新整个页面

#1