---
title: "what are use of bind and unbind method in JQuery on events?"  
description: "what are use of bind and unbind method in JQuery on events?"  
author: "Ethan Karla"  
published: 2021-07-28  
canonical: https://answers.mindstick.com/qa/93827/what-are-use-of-bind-and-unbind-method-in-jquery-on-events  
category: "web application"  
tags: ["web development", "web application development"]  
reading_time: 3 minutes  

---

# what are use of bind and unbind method in JQuery on events?

what are use of bind and unbind [method in JQuery](https://www.mindstick.com/forum/156670/has-method-in-jquery) on [events](https://www.mindstick.com/blog/102/events-in-c-sharp)?

## Answers

### Answer by Ravi Vishwakarma

The jquery **bind()** [method](https://www.mindstick.com/articles/23411/the-most-effective-method-to-find-the-perfect-small-business-phone-system-for-your-business) is used to bind one or more events to the selected element. This method supports one or more browsers. And it's fast accessible. When bind() is activated, calls a function to which all statements are written. Event, data, function, map are passed to this function. Event and Action are mandatory but Map and Data are optional.

The jquery **unbind()** method is used to remove all added events. Whatever is the selected element.

```
Syntax:
$(selector).bind(events, function)   $(selector).bind(events, data, function)   $(selector).bind(events, data, function, map)  $(selector).unbind(event)$(selector).unbind(event, function) $(selector).unbind(event, function, eventObj)
```

\

```
Example :<!doctype html>
<html lang='en'>
<head>
    <!-- Required meta tags -->
    <meta charset='utf-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no'>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
    <!-- Bootstrap CSS -->
    <link rel='stylesheet' href='https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css' integrity='sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T' crossorigin='anonymous'>
    <title>Event demo</title>
    <script>
        $(document).ready(function () {
            $('#clk').bind('click', function (event) {
                var str = '( ' + event.pageX + ', ' + event.pageY + ' )';
                $('p').text('This is a single click! ' + str);
            });
            $('#clk').bind('dblclick', function () {
                $('p').text('This is a double click on ' + this.nodeName);
            });
            $('#clk').bind('mouseenter mouseleave', function (event) {
                $('p').toggleClass('alert alert-success');
            });
            $('button').bind('click', function (event) {
                $('p').text('Unbind Click event ').addClass('alert alert-danger');
                $('#clk').unbind('click');
            });
        });
    </script>
</head>
<body>
    <div class='container'>
        <div class='p-3 my-3 bg-primary text-center text-white rounded-lg' id='clk'>Click me ( one or two times) hover me</div>
        <p class=''>Single Click</p>
        <button class='btn btn-danger' >Remove Click event</button>
    </div>
    <script src='https://code.jquery.com/jquery-3.3.1.slim.min.js' integrity='sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo' crossorigin='anonymous'></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js' integrity='sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1' crossorigin='anonymous'></script>
    <script src='https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js' integrity='sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM' crossorigin='anonymous'></script>
</body>
</html>
```

Output:

![what are use of bind and unbind method in JQuery on events?](https://answers.mindstick.com/questionanswer/9e63154b-ead1-4f05-bd05-0f16cfb4694a/images/711a7010-60aa-40a0-9b5d-1d02c1509fcf.png)

\


---

Original Source: https://answers.mindstick.com/qa/93827/what-are-use-of-bind-and-unbind-method-in-jquery-on-events

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
