Take screenshots on focus change

I am developing a chrome extension and I have a situation where I have two input fields(textbox). Once the focus changes from the first textbox to the second textbox, I want to start taking screenshots whenever a mouse-click event occurs.

My first question is how do I get alerted whenever focus change takes place ?

This is my content script for taking screenshots which I am going to inject into a website. Un开发者_如何学JAVAfortunately it's not working at the moment.

content_script.js

document.onclick=function() {
  {
    chrome.windows.getCurrent(function(win){

  chrome.tabs.captureVisibleTab(win.id, function(imgUrl) {
     var screenshotUrl = imgUrl;
console.log(screenshotUrl);
});
});
};

http://www.devguru.com/technologies/ecmascript/quickref/evhan_onblur.html

Code:
Enter email address <INPUT TYPE="text" VALUE="" NAME="userEmail" onBlur=addCheck()>

<script type="text/javascript" language="JavaScript">

function addCheck() {
 alert("Please check your email details are correct before submitting")
}

</script>