Over a million developers have joined DZone.

Beginner's Guide: Understanding JavaScript Functions onblur() and onfocus()

A basic JavaScript tutorial using ASP.NET C# to change the color of a text box.

· Web Dev Zone

Start coding today to experience the powerful engine that drives data application’s development, brought to you in partnership with Qlik.

In this Article, I will describe how to use the JavaScript function on blur() and on focus() in an ASP.NET C# application using a simple example.

Step 1

Just drag one simple textbox from the toolbox and just add attributes like the below screen shot.

Step 2

Then, as we know, just write the required functions inside the Script tag as below:

That's it, now this function will be triggered on the client side and you will get an output like the below screen shot.

Output 1

While the cursor is on the Bill No. field:


Changed to a yellow color since we have provided the color as "Yellow" in the myFocusFuction() in the above JavaScript code.

Output 2

Once the cursor moves away from the Bill No. field:


Back to the normal color since we didn't provide any color in the myBlurFuction() in the above JavaScript code.

Hope this was useful! Kindly let me know your feedback or thoughts.

Create data driven applications in Qlik’s free and easy to use coding environment, brought to you in partnership with Qlik.


The best of DZone straight to your inbox.

Please provide a valid email address.

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}