TechieIT

Wednesday, January 11, 2012

Wednesday, August 24, 2011

jQuery Events Part - I : Document loading Events and Keyboard Events

jQuery basically have following type of events:

                    Example:
                    $(document).ready(function() {  
                    // Handler for .ready() called.                      
                    });
                    Triggers event when page is fully loaded with all control:
                    $(window).load(function () {
                      // Add code here                              
                    });
                         
                    You may call if any element on page is loaded
                    <img src="something.png" id="imageDemo" />
                    $("#imageDemo").load()(function() {
                      // Add code here.
                    });
                    Example:
                    $(window).unload(function() {
                       alert('I am unloading.');
                    });

                   so for textbox you can write it like:
                      <input id="keyDownDemo" type="text" value="Hello" />
                     $('#keyDownDemo).keydown(function() { 
                      alert(Hello jQuery KeyDown Happened.');
                     });
                   so for textbox you can write it like:
                      <input id="keyUpDemo" type="text" value="Hello" />
                     $('#keyUpDemo).keyup(function() { 
                      alert(Hello jQuery KeyUp happened.');
                     });
                   so for textbox you can write it like:
                      <input id="keyPressDemo" type="text" value="Hello" />
                     $('#keyPressDemo).keypress(function() { 
                      alert(Hello jQuery KeyPress happened.');
                     });

                 

jQuery basics

jQuery,  a Javascript library with cross-browser support and open source which simplify the client side scripting in web/html.
It supports
  • DOM,

  • CSS manipulation,

  • Ajax,

  • animations and effect 

  • extendible plugins. 

Get Started using jQuery:
jQuery needs to add library in html or web page which is a .js file that contains Ajax funcions, effects, DOM, events ...etc. You can download jQuery library from http://docs.jquery.com/Downloading_jQuery

Sample to start with jQuery:

After downloading jQuery library add it to page like below:

<!DOCTYPE html>
<html >
<head>
<title>jQuery Demo</title>
    <script type="text/javascript" src="jquery.js"></script>
</head>
<body>
  <form id="Form1" method="post" runat="server">

  </form>
</body>
</html>


jQuery basics

jQuery,  a Javascript library with cross-browser support and open source which simplify the client side scripting in web/html.
It supports
  • DOM,

  • CSS manipulation,

  • Ajax,

  • animations and effect 

  • extendible plugins. 

Get Started using jQuery:
jQuery needs to add library in html or web page which is a .js file that contains Ajax funcions, effects, DOM, events ...etc. You can download jQuery library from http://docs.jquery.com/Downloading_jQuery

Sample to start with jQuery:

After downloading jQuery library add it to page like below:

<!DOCTYPE html>
<html >
<head>
<title>jQuery Demo</title>
    <script type="text/javascript" src="jquery.js"></script>
</head>
<body>
  <form id="Form1" method="post" runat="server">

  </form>
</body>
</html>