jQuery模糊事件

Question

我在表单上有一个文本区域和一个“添加”按钮。 默认情况下，文本区域显示为缩小和灰色。 重点突出时，将通过更改样式来突出显示。 在模糊时，它应该返回到以前的状态。 除了突出显示文本区域外，添加注释还应切换为可见和隐藏。 问题是，当我在文本区域中输入数据并单击添加按钮时，blur事件隐藏了添加按钮，并且添加按钮上的事件从未触发。

看来我的问题还不清楚...解决方案类似于执行blur事件，只是下一个焦点元素不是“添加”按钮...

Answer 1

如果输入了文本，是否可以安全地假设您不想切换按钮，因为用户打算输入注释？ 如果是这样，您可以执行以下操作：

$(textBox).blur(function() {
  if($(this).val().length == 0) {
    //change the style
    //hide the button
  }
})

Answer 2

仅当在文本区域中未输入任何内容时，才需要取消突出显示文本区域并隐藏“添加”按钮：

$('textarea').blur(function() {
    if($(this).val() != '') {
        // unhighlight textarea
        // hide "add" button
    }
});

这样，如果用户实际在其中输入了某些内容，则无论该字段是否具有焦点，用户始终可以看到该字段和按钮。

Answer 3

在焦点停留在文本框和按钮被隐藏之间放置一小段延迟，例如

function textBox_blur(evt) 
{
    window.setTimeout(
        function() { button.style.display = 'none'; },
        200 // length of delay in milliseconds
    );
}

这将为点击处理留出足够的时间（尽管您可能希望按延迟时间播放）