Javascript onblurが正しく動作しません

Question

divを編集できるようにするための関数を作成しようとしていますが、要素の外側をクリックするようなフォーカスがなくなっても関数を実行する必要があります。

これをフィドルでテストすると、期待される応答は発生しません。代わりに、要素をクリックすると、コンテンツが編集可能になり、同時にonblur関数が実行されます。

これはなぜ起こっているのですか？

https://jsfiddle.net/kz29f77z/

<div id="targetdiv"> 
<p> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 
</p> 
</div> 


$('#targetdiv').click(function(){ 
    this.setAttribute('contenteditable', 'true'); 
    this.onblur(alert()); 
}); 

Answer 1

this.onblur(alert());コールalert()、次いで、onblurにfoo(bar())コールbar正確な方法をその戻り値を通過した後fooにその戻り値を渡します。

代わりに、onblur（this.onblur = function() { alert(); };）に機能を割り当てます。しかし、もっと良いことに、現代的なイベント処理に取り組んでいます。あなたはusql jQueryなので、それは次のようになります：

$(this).on("blur", function() { 
    alert(); 
});