javascript - 仅在按下 tab 键时调用 onBlur 事件

Question

我有一个文本框，只有在按下 tab 键以从文本框中移除焦点时，我才想在该文本框上执行 onBlur 事件。

我怎样才能通过javascript做到这一点？

任何帮助表示赞赏..

Answer 1

在浏览器中，当控件具有焦点时按下 tab 键会将其移动到 tab 顺序中的下一个元素，导致当前元素失去焦点并调度 blur 事件。

因此，您可以测试 Tab 键的按下并基于此调用您的函数，例如

<script type="text/javascript">

function showKey(e) {
  return e.which || e.keyCode;
}

</script>
<form>
  <input type="text" onkeydown="this.form.msg.value = showKey(event);">
  <input type="text" name="msg">
</form>

上面显示tab键的值为9，所以你可以这样做：

if ((e.which || e.keyCode) == 9) {
  // tab key was pressed, do stuff
}

请注意，虽然大多数浏览器支持 e.which，但其他浏览器支持 e.keyCode。

编辑

根据您的评论，以下显示当控件失去焦点时，隐藏字段的值已设置：

  <input type="text" onkeydown="this.form.msg.value = showKey(event);
  (event);" onblur="alert(this.form.msg.value);">

Answer 2

`enter code here`

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#theDiv input").bind("blur", function () {
            setTimeout(function () {
                var isOut = true;
                $("#theDiv input").each(function () {
                    if (this == document.activeElement) isOut = false;
                });
                if (isOut) {
                    // YOUR CODE HERE
                    alert("I am called");
                }
            }, 10);
        });
    });
</script>
<!-- ... -->
<div id="theDiv">
    <input type="text" value="Inside DIV 1" />
    <input type="text" value="Inside DIV 2" />
    <input type="text" value="Inside DIV 3" />
</div>
<input type="text" value="Outside DIV" />

Answer 3

<script type="text/javascript">

function callfunc() {
 alert("Hello");
}

</script>


<form>
  <input type="text" onblur="callfunc();">
</form>