javascript - 如何避免在切换可见性后丢失输入事件？

Question

由于程序要求，我有一个应该保持焦点的输入。在使用该软件时，输入可能会在某个时候隐藏，但当再次出现时，它应该会恢复焦点，但事实并非如此。不过，如果您检查输入上的绑定(bind)事件，您会发现它实际上并没有丢失事件。

有一个简单的 jsfiddle 显示了这种行为:https://jsfiddle.net/5puu261v/

$('#barcode').focus()

$('#barcode').focusout(function(){
  $(this).focus();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="$('#barcode').toggle()">Toggle input</button>
<input type="text" id="barcode" />

如果我能在不重新绑定(bind)事件的情况下修复或避免它，我们将不胜感激。

编辑:

重点是:为什么在切换后点击任何其他元素(作为使其再次可见的按钮)时输入没有获得焦点？

Answer 1

Updated fiddle .

您可以将 .focus() 添加到点击事件中，这样每次点击按钮时输入都会聚焦，例如:

$('button').click(function(){
    $('#barcode').toggle().focus();
});

HTML :

<button>Toggle input</button>
<input type="text" id="barcode" />

希望这对您有所帮助。

$('#barcode').focus()

$('#barcode').focusout(function(){
    $(this).focus();
});

$('button').click(function(){
    $('#barcode').toggle().focus();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button>Toggle input</button>
<input type="text" id="barcode" />