Javascript:在 Firefox 上以奇怪的行为输入输入元素

Question

我有一个带有选择、按钮和输入元素的 html 表单。

<form action="">
    <button>innocent button</button>
    <select multiple name="multiple">
    <option selected value="a">A</option>
    <option value="b">B</option>
</select>
<input style="width:300px" type="text" value="press here enter and look at the multiple select" name="" />
</form>

和一些 jquery javascript

$(document).ready(function(){
            console.log('hi');


            var $button = $('button');

            $button.on('click',function(e){

                $('select option').first().attr('selected',false);
                e.preventDefault();

            });

演示:在这里试试: http://jsfiddle.net/3Rjdh/

在 Chrome 上一切正常。但在 Firefox 上:如果您在输入字段中按 ENTER，则选择元素将失去选中状态。

Firefox 有什么问题？

Answer 1

当您在输入上按下回车键时，您实际上是在触发按钮的点击事件，尝试将 conole.log 放在那里，您会看到它触发

您可以通过 doing something this 停止提交

  function stopSubmit(e){
      e = e || event;
      return (e.keyCode || event.which || event.charCode || 0) !== 13;
   }

然后在你的表单中添加按键事件

    <form onkeypress="return stopSubmit(event)">

参见 updated fiddle