Was ist falsch an meinem Body-Click-Event?

Question

Ich habe das Textfeld:

<input type='text' id='title' name='title'> 
<div id='error' class='error'></div> 

Wenn der Benutzer aus dem Textfeld klickt und es ist ein Validierungsproblem, das div „Fehler“ erscheinen.

Was ich tun möchte, ist das kleine Div ausblenden, wenn der Benutzer irgendwo im Körper klickt. Ich habe e.stopPropagation im Body-Click-Event versucht, aber nicht funktioniert.

Die div erscheint nie da, wenn ich aus dem Textfeld verschwimmen, es ist ein Körper klicken betrachtet hat

Bitte lassen Sie mich wissen, wenn Sie eine Idee haben. Grüße

EDIT: Ich habe den Code aktualisiert. Der Code innerhalb des body-click-Ereignisses soll den "error" -div verbergen, wenn alles außer dem Textfeld angeklickt wird, aber nicht zum Funktionieren gebracht werden kann.

$('body').click(function(event){ 
     if ($(event.target).closest('#title').get(0) == null) { 
      $("#error").hide(); 
      }}); 

// Validation 
$('#title').blur(function(){ 
    var titleinput=$('#title').val(); 
    if (titleinput.length <30 || titleinput.length >50){ 
     $('#error').text('Your title must be between 30 and 50 characters').show(); 
     } 
    }); 

Answer 1

Leider seit blur und click verschiedene Ereignisse sind, können Sie nicht stopPropagation verwenden. Der einzige Weg, um darüber nachzudenken, ist, es zu fälschen. Sie können den ersten Klick ignorieren, der innerhalb eines Bruchteils einer Sekunde des Ereignisses blur auftritt.

http://jsfiddle.net/LeNDp/1

var ignoreClicks = false; 
var timer; 

$("body").click(function() { 
    if(!ignoreClicks){ 
     $("#msg").fadeOut(); 
    }else{ 
     if(timer) clearTimeout(timer); 
     ignoreClicks = false;   
    } 
}); 

$("input").blur(function(e) { 
    ignoreClicks = true;  
    $("#msg").stop(true,true).show(); 

    if(timer) clearTimeout(timer); 
    timer = setTimeout(function(){ignoreClicks=false;}, 250); 
});​