jQuery callbacks.lock() Method

Last Updated : 23 Jul, 2024

The callbacks.lock() method in jQuery is used to lock a callback list in the state.

Syntax:

callbacks.lock()

Return Value:

This method returns the callback object to which it is attached.

Example 1:

This example first adds and fires the function, then locks the callbacks list, and then again adds and fires the function.

html

<!DOCTYPE HTML>
<html>

<head>
    <script src=
"https://code.jquery.com/jquery-3.5.0.js">
    </script>
</head>

<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksForGeeks
    </h1>

    <p>
        JQuery | callbacks.lock() method
    </p>
    
    <button onclick="Geeks();">
        click here
    </button>
    
    <p id="GFG_DOWN"></p>

    <script>
        let el_down = document
                .getElementById("GFG_DOWN");
                
        let res = "";
        let callbacks = jQuery.Callbacks();
        function Geeks() {
            let func = function (val) {
                res = res + 
                    "value passed is - " + val;
            };

            // Function added to list
            callbacks.add(func);
            callbacks.fire("gfg_1");

            // Locking the callback list
            callbacks.lock(); 

            // Function again added to list
            callbacks.add(func); 
            callbacks.fire("gfg_2");
            el_down.innerHTML = res;
        } 
    </script>
</body>

</html>

Output:

Example 2:This example provides a button to lock the list and then add and fire the function to check whether the method is working or not.

html

<!DOCTYPE HTML>
<html>

<head>
    <script src=
"https://code.jquery.com/jquery-3.5.0.js">
    </script>
</head>

<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksForGeeks
    </h1>

    <p>
        JQuery | callbacks.lock() method
    </p>

    <button onclick="Geeks();">
        click here
    </button>
    
    <button onclick="lock();">
        lock here
    </button>
    
    <p id="GFG_DOWN"></p>

    <script>
        var el_down = document
                .getElementById("GFG_DOWN");

        var res = "";
        var callbacks = jQuery.Callbacks();
        function lock() {
            callbacks.lock();
        }
        function Geeks() {

            // Function to be added to the list
            var fun = function (val) {
                res = res + "This is function and "
                + "value passed is " + val + "<br>";
            };

            callbacks.add(fun); // Adding
            callbacks.fire("GFG_1");
            el_down.innerHTML = res;
        } 
    </script>
</body>

</html>

Output:

jQuery callbacks.fired() Method

PranchalKatiyar

Improve

Article Tags :

jQuery callbacks.lock() Method

Similar Reads

Thank You!

What kind of Experience do you want to share?