Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • use of one() method in jQuery

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 349
    Comment on it

    one() method:

    One() method is used to attach events to selected elements and also used to specify a function when the event occurs. It is similar to on() and bind() method but the events attached using one() method executes only once for each element.

    We can do the same using on() method but we have to explicitly unbind the event using off() method.

    Syntax:

    $(selector).one(event,data,function)

    Example:

    <!DOCTYPE html>
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
        $("p").one("click", function(){
            $(this).animate({fontSize: "+=7px"});
        });
    });
    </script>
    <style type="text/css">
    	.container{background:#5AB0A6;border:2px solid grey;padding:40px 0px;}
    	.container .sec-c{margin:0 auto;max-width:800px;}
    </style>
    </head>
    <body>
    
    <div class="container">
    	<div class="sec-c">
    		<p>Click on me</p>
    		<p>One method example</p>
    		<p>Click On the paragraph to increase size</p>
    	</div>
    </div>
    
    </body>
    </html>

    In the above example we are increasing the font-size of paragraphs by clicking on it , as we used one() method so it will increase the size only one times of <p> tag on which user will click.

    You can check the output of above example here:https://jsfiddle.net/u1obesLb/

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: