Question

我遇到一些问题，只要表单中有输入，就会触发刷新页面的输入键。

如果按下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>

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

Answer 1

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

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

或者你可以像这样放置你的表格标签

<form onsubmit="return false">

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

还有一个额外/按钮标记错误...删除它而改为使用

<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代码中存在语法错误：

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

将其更改为：

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

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

Answer 4

place： e.preventDefault(); 按键功能内

按下回车键时不刷新页面

4 个答案: