jQuery 事件 $.proxy() 方法



jQuery 事件$.proxy()方法允许您创建一个具有特定上下文(即其值)的新函数。这对于将事件处理程序绑定到上下文需要指向不同对象的元素很有用。

$.proxy() 方法在 jQuery 3.3 版本中已弃用。

语法

以下是 jQuery 事件$.proxy(()方法的语法:

$(selector).proxy(function, context)

参数

该方法接受两个名为“function”和“context”的参数。这些参数描述如下:

  • function - 将更改其上下文的现有函数。
  • context - 函数上下文应设置为的对象。

返回值

此方法不返回值。

示例 1

以下是 jQuery 事件$.proxy()方法的基本示例:

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
    <p>Click on the below button to set the context of the details function inside studentDetails.</p>
    <button>Click me</button>
    <br><br>
    <span></span>
    <script>
        var studentDetails = {
            details: function() {
                $('span').text("Student details: Name, age, city, etc.");
            }}
            $("button").click($.proxy(studentDetails, "details"));
    </script>
</body>
</html>

输出

执行上述程序后,将显示一个按钮。单击时,它将在“studentDetails”对象中设置“details”函数的上下文:


示例 2

以下是 jQuery 事件$.proxy(()方法的另一个示例。我们使用此方法将函数的上下文更改为特定对象:

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
    <p>The pop-up alert "Hello TutorialsPoint" will appear on the browser screen every 2 seconds.</p>
    <script>
        var obj = {
            name: "TutorialsPoint",
            sayHello: function(){
                alert("Hello " + this.name);
            }
        };
        //setInterval(obj.sayHello, 2000); it will display only "Hello" + undefined.
        setInterval($.proxy(obj.sayHello, obj), 2000);
    </script>
</body>
</html>

输出

上面的程序每两秒显示一个包含指定内容的弹出警报:


jquery_ref_events.htm
广告