Tutorials Point

  jQuery Tutorial
  jQuery UI
  jQuery References
  jQuery Resources
  Selected Reading

Copyright © 2014 by tutorialspoint

  Home     References     Discussion Forums     About TP  

jQuery - one( type, [data], fn ) Method

previous next AddThis Social Bookmark Button



The one( type, [data], fn ) method binds a handler to one or more events to be executed once for each matched element. The handler is executed only once for each element. Otherwise, the same rules as described in bind() apply.

Possible event values: blur, focus, load, resize, scroll, unload, click etc.


Here is the simple syntax to use this method:

selector.one( type, [data], fn )


Here is the description of all the parameters used by this method:

  • type: An event type.

  • data: This is optional paramter and represents additional data passed to the event handler as event.data.

  • fn: A function to bind to the event on each of the set of matched elements.


Following is a simple example a simple showing the usage of this method. Here it binds click event with each <div> element. Try to click any square two times, it won't react unlike bind() method:

<title>the title</title>
   <script type="text/javascript" 
   <script type="text/javascript" language="javascript">
   $(document).ready(function() {

     $('div').one('click', function( event ){
         alert('Hi there!');


      .div{ margin:10px;padding:12px;
             border:2px solid #666;
   <p>Click on any square below to see the result:</p>
   <div class="div" style="background-color:blue;"></div>
   <div class="div" style="background-color:green;"></div>
   <div class="div" style="background-color:red;"></div>

To understand it in better way you can Try it yourself.

previous next Printer Friendly