jQuery $.proxy()方法

jQuery $.proxy()方法

jQuery中的$.proxy() 方法接受一个现有的函数,并返回一个具有特定上下文的新函数。一般来说,它是用于附加事件到一个元素,其中的上下文是指向一个不同的对象。

语法:

$(selector).proxy(function, context)
$(selector).proxy(context, name)

参数:该方法接受上面提到的和下面描述的三个参数。

  • function。它持有将被调用的现有函数名称。
  • context。它显示了函数所在的对象的名称。
  • name: 其上下文要被改变的函数。

例子1:这个例子显示h3元素的上下文。

<!DOCTYPE html>
<html>
      
<head>
    <title>
        jQuery .proxy() Method
    </title>
      
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
      
    <script>
        (document).ready(function() {
           
            test = function() {
                this.txt = "Property of Object";
                ("h3").click(.proxy(this.myClick, this));
            };
               
            test.prototype.myClick = function(event) {
                alert(this.txt);
                alert(event.currentTarget.nodeName);
            };
               
            var x = new test();
           
        });
    </script>
</head>
  
<body style="text-align:center;">
   
    <h1>Welcome to GeeksforGeeks!.</h1> 
      
    <div style="background-color:green">
        <h3>Geeks for Geeks.</h3>    
    </div>
</body>
  
</html>

输出:

  • 在点击标题文字h3之前。
    jQuery $.proxy()方法
  • 点击标题文字h3后。
    jQuery $.proxy()方法
  • 点击 “确定 “按钮。
    jQuery $.proxy()方法

实例2:本实例调用objPerson对象并显示其内容。

<!DOCTYPE html>
<html>
      
<head>
     <title>
        jQuery .proxy() Method
     </title>
       
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
      
    <!-- Script to illustrate.proxy() Method -->
    <script>
        (document).ready(function(){
            var objPerson = {
                test: function() {
                    ("h2").after("GeeksforGeeks");
                }
            };
          
            ("button").click(.proxy(objPerson, "test"));
        });
    </script>
</head>
  
<body style="text-align:center;">
  
    <h1>Welcome to GeeksforGeeks!.</h1> 
      
    <div style="background-color:green">
        <button>The $.proxy Method.</button>        
        <h2></h2>  
    </div>
</body>
  
</html>

输出:

  • 在点击按钮之前。
    jQuery $.proxy()方法
  • 点击该按钮后。
    jQuery $.proxy()方法

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程