javascript - IE9中的文本框焦点事件和输入问题

Question

我有一个文本输入和一个与输入相邻的提交类型的按钮。我已将focusout事件处理程序绑定到输入并单击事件处理程序到按钮。现在，当我专注于输入然后按下enter时，focusout事件处理程序被触发并且按钮事件处理程序被触发。我只想focusout在文本框焦点丢失时触发。我应该怎么办 ？

代码 ：-

 <div >
     <span>Local Currency: </span>
     <input type='text' id='txtFocusElement'  />
     <button id="btnClickElement" >
         <span> Add new line</span>
     </button>
 </div>

我使用选择器作为：

 $("#txtFocusElement").bind("focusout", function() {
      console.log('focusout');
 })
 $("#btnClickElement").bind("click", function() {
      console.log('click');
 })

并将上面的代码写在我在加载文档时调用的一个函数中。

Answer 1

它的 IE9 问题与 HTML 按钮标签有关。

所以我们应该尝试使用带有属性类型的 HTML 输入标签作为按钮。

上面的代码可以重写为：

<div >
     <span>Local Currency: </span>
     <input type='text' id='txtFocusElement'  />
     <input id="btnClickElement" type="button" value="Add new line" />
</div>

使用这个我的问题得到解决。

Answer 2

尝试附加到mouseup事件而不是click，这是我现在看到的唯一解决方案

您还可以添加对按下的鼠标按钮的检查，因此如果用户按下右键则不会触发

var ClickElementEventHandler = function(e) {
    if (e.which != 1) return;
    //your code
};

$("#btnClickElement").bind("mouseup",ClickElementEventHandler)

Answer 3

您可以尝试将选择器更改为 input[type=text]。这只会在您专注于文本字段时触发。