jquery根据您下一步关注的位置聚焦不同的事件

时间:2014-05-18 20:23:39

标签: jquery input focusout focusin

我有一个带有文本输入字段$ newItemField的列表,其默认值为“New Item”。通过单击输入按钮$ addButton,您可以将$ newItemField的值添加到列表中。

当.focusin $ newItemField我删除默认值this.value =“”;

当使用$ newItemdField =“”的.focusout时,我将默认值重置为$ newItemField =“New Item”。两者都很好。

我的问题是,如何将.focusout与特定输入字段的.focusin相结合。换句话说当.focusout wuth $ newItemField =“”我只想在未点击$ addButton时重置默认值????

现在发生的是,当$ newItemField =“”并且我点击$ addButton时,.focusout首先工作($ newItemField =“New Item”)然后我在列表中添加一个名为“New Item”的项目。这就是我想要防止发生的事情。

我尝试了很多使用if和click(),但它没有用。我将不胜感激以下对我的代码的任何形式的支持。

$newItemField.each(function() {
    $(this).data('default', this.value);
})
.focusin(function() {
    if (this.value == $(this).data('default')) {
        this.value = '';    
    }
})
.focusout(function() {
    if  (this.value === ""){            
        this.value = $(this).data('default');      
    }

});

$addButton.click(function() {
    addItem();
    $newItemField.select();
});

这是威廉回答后的变化。现在§newItemField在关注之后不显示任何值,而与.activeElement无关。换句话说,当没有点击添加按钮时,我没有错过默认值“New Item”。

$newItemField.each(function() {
    $(this).data('default', this.value);
})
.focusin(function() {
    if (this.value == $(this).data('default')) {
        this.value = '';    
    }
})
.focusout(function() {

    setTimeout(function () {


    if ($(document.activeElement).attr('id')!==$('add')//the id of the add button is #add
        {

        if ($newItemField.value === ""){
            this.value = $(this).data('default');
        }             

    }
}, 100);



});

1 个答案:

答案 0 :(得分:0)

您可以在focusout函数中使用setTimeout来检查按钮是否具有焦点,如果没有则更改值。

.focusout(function() {
    setTimeout(function () {
        if ($(document.activeElement).attr('id')!='$addButton')
        {
             //run code
             //remember 'this' no longer refers to $newItemField
        }
    }, 100);

});

试试这个:

.focusout(function() {
        setTimeout(function () {
            if ($(document.activeElement).attr('id') != ('add')) {
                {
                $(newItem).val('New Item');
                }

            }
        }, 100);


});