按Enter键时不刷新页面

Question

在输入表单时，Enter键在触发页面刷新时遇到一些问题。

以下代码不会刷新页面，如果按下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>

我正在尝试用jQuery来解决问题，但在这方面需要帮助。任何建议，将不胜感激！

Answer 1

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

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

或者您可以像这样放置表单标签

<form onsubmit="return false">

无论哪种方式，您都必须在输入中写入onClick =“ SOMEFUNCTION（）”

也有一个额外的/ button标签错误...删除该错误，而是使用

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

注意结尾斜杠

Answer 2

只需更改您的html：

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

jsfiddle here-就像魅力一样工作>>

Answer 3

您的html代码中有语法错误：

Answer 4

地点：e.preventDefault（）;内部按键功能