Question

Html代码：

    <input type="text" id="normal_input" />
    <button class="normal_button">Button</button>

Js代码：

    $('.normal_button').click(function(e){
       console.log(e);
    });

单击按钮
时，该功能正常但是当我在输入文本中按Enter键时，它也会触发按钮单击功能。
我通过更改按钮元素来解决这个问题，输入按钮
但我仍然对原因感到好奇是某种jquery bug或者出了什么问题？

Answer 1

默认情况下，除非您为<button>元素指定任何操作，否则它将像submit按钮一样。当您从其父窗体的输入控件

按Enter键时，基本上submit按钮将被触发

Answer 2

默认情况下，表单内的按钮就像提交输入一样。因此，当您按Enter键时，它会触发该功能。

Answer 3

<button>的默认行为是提交。如果你添加type="button"，它将作为普通按钮。

Answer 4

它不是一个错误。它是输入时输入字段的默认行为。或者单击一个type = submit的按钮元素或一个表单中的input type = image。

如果您希望在输入字段上按Enter键时避免提交表单。尝试下面的代码：

HTML

<form>
<input name="ip" type="text" class="dont_submit" id="normal_input" />
    <input type="button" class="normal_button" value="button"/>
</form>

脚本

<script>

    $('.dont_submit').keydown(function(ev){
        console.log(ev.which);
        if (ev.which === 13) {            
            ev.preventDefault();
        }
    });

</script>

Jquery通过输入而不是按钮触发

4 个答案:

HTML

脚本