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

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 193
    Comment on it

    Unbind() method:

    Unbind() method is used to remove events attached to html element while bind() method is used to attach events to selected html elements .

    It is mainly used to prevent the events  to be executed when needed and when no longer needed unbind method will remove the event attached to html element.

    Syntax:

    $(selector).unbind(event,function,eventObj)

    Example:

    <!DOCTYPE html>
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <style type="text/css">
    	button{background:black;color:#fff;border-radius:4px;border:1px solid black;padding:5px}
    	.container >p{text-align:center;max-width:}
    	.container{max-width:250px;padding:10px 0px;}
    </style>
    <script>
    $(document).ready(function(){
        $(".container >p").click(function(){
            $(this).slideToggle();
        });
        $("button").click(function(){
            $(".container >p").unbind();
        });
    });
    </script>
    </head>
    <body>
    	<div class="container">
    	<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
    	<p>The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters.</p>
    	<p>As opposed to using 'Content here, content here', making it look like readable English.</p>
    	</div>
    	<button style="">Click to remove events attached</button>
    </body>
    </html>

    In the above example we have attached slideToggle() event to <p> tag and when user will click on button event attached to <p> tag will no longer work.

    You can check the above example output here:https://jsfiddle.net/bw99ptzn/1/

 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: