我创建了一个带有输入字段的简单“无限”表单。每次聚焦一个空输入时，它都会创建一个新输入，并且在空输入字段模糊时，该字段被删除。
在此处查看示例
我使用以下代码来实现这一切：
var $input = $('<div/>').html( $('<input/>').addClass('value') );
$('form').append( $input.clone() );
$('form').on( 'focus', 'input.value', function(e) {
// Add new input if the focused one is empty
if(!$.trim(this.value).length) {
$('form').append( $input.clone() );
}
}).on( 'blur', 'input.value', function(e) {
var $this = $(this);
if( !$.trim(this.value).length ) {
console.log('REMOVING INPUT');
$this.parent().remove();
} else {
$this.attr('name', 'item-'+$this.val());
}
});
然而问题是，在 Chrome 中，blur当我切换到另一个应用程序 ( ⌘tab) 时，该事件会被触发两次。这会产生错误，因为无法删除节点，因为它已经消失了：
Uncaught Error: NOT_FOUND_ERR: DOM Exception 8
Firefox 似乎工作正常。
那么为什么blur事件会触发两次，我该如何防止这种情况发生呢？
编辑- 尝试了这个问题的答案，但没有运气。仍然在 Chrome 中收到错误消息，我做错了什么？
有没有办法检查元素是否仍然存在？因为第二次blur触发节点被删除。$(this).length仍然是非零的。