Changing Textbox Style on Focus using jQuery


HTML:

<table>
 <tr><td>Name </td>   <td><INPUT type="text"/></td>     </tr>
 <tr> <td>Age</td>    <td><INPUT type="text"/></td>    </tr>
 <tr><td>Phone no.</td>   <td><INPUT type="text"/></td>      </tr>
</table>
CSS:
.focus {
    border: 2px solid #AA88FF;
    background-color: #FFEEAA;
 }

jQuery:

<script type="text/javascript" src="./js/jquery-1.4.4.js"></script>
<
script type="text/javascript">
    $(document).ready(function() {

$('input[type="text"]').focus(function() {

    $(this).addClass("focus");

});

  

$('input[type="text"]').blur(function() {

    $(this).removeClass("focus");

});
});
</script>

Ebook Download
View all
Learn
View all