消失div onblur

Question

HTML

<input type="text" id="match1">
<div id="divf">It is a div which has a dark future</div>
<button>Not Remove</button>

和脚本

$(function(){
    $("input").blur(function()
    {
       $("#divf").remove(); 
    });
});

现在从代码中可以清楚地看到我想在输入模糊时删除div。但是如果有人点击按钮我不想删除div。我不知道该怎么做。可以有人解决这个问题

Answer 1

您可以在.blur()中设置超时，然后在单击按钮时将其清除。

var to = false;

$('input').blur(function() {
    // start the timer
    to = setTimeout('removeDiv', 200);
});

$('button').click(function() {
    // if the timer is still running, clear it
    to && clearTimeout(to);
});

function removeDiv()
{
    $("#divf").remove();
    // reset timer
    to = false;
}

当焦点从输入直接转到按钮（点击它）时，清除定时器并且不删除div。

Answer 2

使用此代码代替您的代码

$(function(){
    $("#match1").blur(function()
    {
       $("#divf").remove(); 
    });
});

Answer 3

如果你想只放置id为match1的文本字段，那么只有当字段有蓝色时才会删除div

$(function(){

   var isButtonClicked = false;
   $('button').one('click', function(){
      isButtonClicked = true;
   });

    $("#match1").blur(function()
    {
       if(!isButtonClicked)
            $("#divf").remove(); 
    });
});

如果你想只是输入文字，那么div将在每个文本框的蓝色上删除

    $(function(){
       var isButtonClicked = false;
       $('button').one('click', function(){
      isButtonClicked = true;
    });

    $("input[type=text]").blur(function()
        {
           if(!isButtonClicked) 
               $("#divf").remove(); 
        });
    });

Answer 4

我编辑了@Adil的答案，得到了我想要的东西

$(function(){
       var isButtonClicked = false;
       $('button').one('mousedown', function(){
      isButtonClicked = true;
    });

    $("input[type=text]").blur(function()
        {
           if(!isButtonClicked) 
               $("#divf").remove();
               else isButtonClicked = false;
        });
    });