> 웹 프론트엔드 > JS 튜토리얼 > Jquery에서 이 포인터를 변경하는 방법

Jquery에서 이 포인터를 변경하는 방법

coldplay.xixi
풀어 주다: 2020-11-30 17:06:42
원래의
3183명이 탐색했습니다.

jquery에서 this 지점을 변경하는 방법: 1. 할당 [var that=this;]을 사용하여 중첩 함수의 [this] 지점을 변경합니다. 2. es6 화살표 함수를 사용하여 this 지점을 변경합니다. 코드는 [$('div') .on('click', function()]입니다.

Jquery에서 이 포인터를 변경하는 방법

이 튜토리얼의 운영 환경: windows10 시스템, jquery2.2.4, 이 기사는 모든 브랜드에 적용됩니다.

jquery에서 이 지점을 변경하는 방법:

var that=this; 할당을 사용하여 중첩 함수의 'this' 포인터를 변경하세요.var that=this; 来改变嵌套函数的 'this' 指向

利用es6箭头函数 改变this指向

    <script>
      function show() {
       alert(this)
      }
    //   show() //-> window
      //   show.call(document) // ->document  | 原生的方法
     $.proxy(show, document)() // ->document  | jQuery方法
  </script>
로그인 후 복사

tips: 对于一个传参的函数如上例中的 show(c1,c2),使用.proxy()也有几个场景,按需求进行传参,如:

1. .proxy( show, document, c1, c2 ) // --> 加()后,才进行调用

2. .proxy( show, document )( c1, c2 )

es6<을 사용하세요. /code> this<blockquote><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"> &lt;script&gt; // 利用赋值 var that = this; 来改变嵌套函数的&amp;#39;this&amp;#39;指向 $(&amp;#39;div&amp;#39;).on(&amp;#39;click&amp;#39;, function() { var that = this setTimeout(function() { console.log(that) // -&gt; div }) }) &lt;/script&gt;</pre><div class="contentsignin">로그인 후 복사</div></div><p>의 포인터를 변경하는 화살표 함수 팁: 매개변수 전달의 경우 함수는 위 예의 show (c1, c2)와 같습니다. <code>.proxy()</를 사용하는 여러 가지 시나리오가 있습니다. code>. 요구사항에 따라 매개변수가 전달됩니다. 예: document, c1, c2 ) // --> 호출하기 전에 ()를 추가하세요.
2. , document )( c1, c2 ) // -->

    <script>
     // 利用es6 箭头函数 改变 this指向
      $(&#39;div&#39;).on(&#39;click&#39;, function() {
         setTimeout(() => {
         console.log(this) // -> div
        })
     })
    </script>
로그인 후 복사
rrreee🎜를 직접 호출합니다. 관련 무료 학습 권장 사항: 🎜JavaScript🎜(동영상)🎜🎜

위 내용은 Jquery에서 이 포인터를 변경하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿