programing

jQuery에서 live()를 on()으로 변환한다.

kingscode 2022. 9. 8. 23:05
반응형

jQuery에서 live()를 on()으로 변환한다.

응용 프로그램에서 동적으로 드롭다운을 추가했습니다.사용자는 필요한 만큼 추가할 수 있습니다.

나는 전통적으로 jQuery를 사용하고 있었다.live()이러한 드롭 다운의 어느쪽인가를 검출하는 방법.change()ed:

$('select[name^="income_type_"]').live('change', function() {
    alert($(this).val());
});

jQuery 1.7에서 다음 내용으로 업데이트되었습니다.

$('select[name^="income_type_"]').on('change', function() {
    alert($(this).val());
});

Docs를 보면, 이것은 완전히 유효합니다(그렇습니까?). 그러나 이벤트 핸들러는 부팅되지 않습니다.물론 jQuery 1.7이 로드되어 실행되고 있는 것을 확인했습니다.에러 로그에 에러는 없다.

내가 뭘 잘못하고 있지?감사합니다!

문서에는 다음과 같이 기술되어 있습니다(굵은 글씨).

이벤트 핸들러는 현재 선택된 요소에만 바인드됩니다.이러한 핸들러는 코드 호출 시 페이지에 존재해야 합니다..on().

등가.live()그런 것 같아

$(document.body).on('change', 'select[name^="income_type_"]', function() {
    alert($(this).val());
});

이벤트 핸들러를 가능한 한 요소에 가깝게 바인드하는 것이 좋습니다.즉, 계층 내에서 보다 가까운 요소에 바인드하는 것이 좋습니다.

업데이트: 다른 질문에 답변하는 동안 문서에도 이 내용이 기재되어 있음을 알게 되었습니다.

의 개서.live()후계자 방식은 간단합니다.다음은 3가지 이벤트 접속 방식 모두에 대응하는 콜용 템플릿입니다.

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+

선택한 답변 외에

항구jQuery.livejQuery 1.9+로 이동할 수 있습니다.이를 JavaScript 파일에 추가합니다.

// Borrowed from jQuery 1.8.3's source code
jQuery.fn.extend({
  live: function( types, data, fn ) {
          if( window.console && console.warn ) {
           console.warn( "jQuery.live is deprecated. Use jQuery.on instead." );
          }

          jQuery( this.context ).on( types, this.selector, data, fn );
          return this;
        }
});

주의: 위의 기능은 jQuery v3에서는 다음과 같이 동작하지 않습니다.this.selector이 삭제됩니다.

또는 https://github.com/jquery/jquery-migrate 를 사용할 수 있습니다.

서드파티 코드 편집이 필요 없는 더 나은 솔루션을 찾았습니다.

https://github.com/jquery/jquery-migrate/ #readme

모든 버전 관리 문제를 해결하려면 Visual Studio에 jQuery Migrate NuGet 패키지를 설치합니다.다음 번에 Microsoft가 방해받지 않는 AJAX 및 검증 모듈을 업데이트할 때 마이그레이션 스크립트 없이 다시 시도하여 문제가 해결되었는지 확인합니다.

jQuery Migrate는 jQuery Foundation에 의해 관리되기 때문에 서드파티 라이브러리뿐만 아니라 라이브러리 갱신 방법에 대한 경고 메시지도 받을 수 있습니다.

선택한 답변 외에

Visual Studio를 사용하는 경우 Regex Replace를 사용할 수 있습니다.
[)]> [ 후 (Find Replace)]> [ 내 치환(Replace in Files)]에서
Ctrl + + H 는 ctrl Ctrl + Shift + H

[ Replace ][Find and Replace]라는 필드를 설정합니다.

색색: : \$\((.*)\)\.live\((.*),
체체: : $(document.body).on($2,$1,
에서 " Expressions를 선택합니다.

x.devision , jquery version x.x.x.devision open editor를 찾습니다.jQuery.fn.extend

코드를 추가하다

live: function( types, data, fn ) {
        jQuery( this.context ).on( types, this.selector, data, fn );
        return this;
    },

예: jquery-2.1.js --> 행 7469 (jQuery.fn.extend)

이미지 보기 예시

언급URL : https://stackoverflow.com/questions/8021436/turning-live-into-on-in-jquery

반응형