How to get div onblur event to execute a javascript function?

javascript jquery html onblur
Vamsi picture Vamsi · Jan 31, 2011 · Viewed 39.6k times · Source

Hi I have a div that contains three textboxes , i need a function to be called once the control is out of the div tag, I don't want to use the onclick event because the focus can be moved out of the div by pressing the tab key on the keyboard or some other way. I would also like to know if there is a way to achieve this using any javascript libraries like jquery.

Thank you, this is the sample html code

<html>
<head>
    <title>Div Onblur test</title>

    <script type="text/javascript">
        function Callme() {
            alert("I am Called")
        }
    </script>

</head>
<body>
    <div onblur="javascript:Callme();">
        <input type=text value ="Inside DIV 1" />
        <input type=text value ="Inside DIV 2" />
        <input type=text value ="Inside DIV 3" />
    </div>
     <input type=text value ="Outside DIV" />
</body>
</html>

Answer

Bitsplitter picture Bitsplitter · Jan 31, 2011

You'll need to add tabindex=0 to the div in order for it to gain focus. So something like

<div tabindex="-1" onblur="Callme();">

should do it.

Related questions

How to blur the div element?

I have a dropdown menu inside a DIV. I want the dropdown to be hide when user click anywhere else. $('div').blur(function() { $(this).hide(); } is not working. I know .blur works only with <a> but in this …

Read More
How do I check whether a checkbox is checked in jQuery?

I need to check the checked property of a checkbox and perform an action based on the checked property using jQuery. For example, if the age checkbox is checked, then I need to show a textbox to enter age, else …

Read More
How can I know which radio button is selected via jQuery?

I have two radio buttons and want to post the value of the selected one. How can I get the value with jQuery? I can get all of them like this: $("form :radio") How do I know which one is …

Read More