jQuery | undelegate() 与示例

undelegate() 方法是 jQuery 中的一个内置方法，用于从所选元素中删除指定的事件处理程序。

句法：

$(selector).undelegate(selector, event, function)

参数：此方法接受上面提到和下面描述的三个参数：

• 选择器：它是一个可选参数，用于指定将从中删除事件的选择器。
• event：它是一个可选参数，用于在选择器上指定事件类型的名称。
• 函数：它是一个可选参数，用于指定要删除的处理程序函数的名称。

返回值：此方法返回选定元素，并通过 undelegate() 方法进行指定更改。

下面的例子说明了 jQuery 中的 undelegate() 方法：

示例 1：此示例不包含任何参数。

    
        The undelegate Method
        
        
          
        
        
            $(document).ready(function() {
                $("body").delegate("p", "click", function() {
                    $(this).css("font-size", "25px");
                });
                $("button").click(function() {
                    $("body").undelegate();
                });
            });
        
        
            div {
                width: 300px;
                height: 100px;
                background-color: lightgreen;
                padding: 20px;
                font-weight: bold;
                font-size: 20px;
                border: 2px solid green;
            }
            button {
                margin-top: 10px;
            }
        
    
    
        
            
            Welcome to GeeksforGeeks!.
        
        
        Remove...!
    
                                            

输出：
单击任意位置之前：

点击段落后：

注意：先点击按钮再点击段落，则不会发生任何变化。

示例 2：此示例包含所有参数。

    
        The undelegate Method
        
        
          
        
        
            $(document).ready(function() {
                $("body").delegate("div", "click", function() {
                    $(this).animate({
                        height: "+=100px"
                    });
                    $(this).animate({
                        width: "+=100px"
                    });
                });
                $("button").click(function() {
                    $("body").undelegate("div", "click");
                });
            });
        
        
            div {
                width: 30px;
                height: 30px;
                background-color: green;
            }
            button {
                margin-top: 10px;
            }
        
    
    
        
        
        Click here..!
    

输出：
在点击任何地方之前：

单击 div 元素后调整大小。

注意：如果单击按钮，然后单击 div 元素，则尺寸不会发生变化。