[javascript] jQuery에서 live ()를 on ()으로 바꾸기

Program / 글쓴이

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

나는 전통적으로 jQuery의 live()방법을 사용하여 이러한 드롭 다운 중 하나가 언제 발견되었는지 감지했습니다 change().

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

jQuery 1.7부터는 다음과 같이 업데이트했습니다.

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

문서를 보면 완벽하게 유효해야합니다 (맞습니까?). 그러나 이벤트 핸들러는 절대 실행되지 않습니다. 물론 jQuery 1.7이로드되어 실행되고 있음을 확인했습니다. 오류 로그에 오류가 없습니다.

내가 뭘 잘못하고 있죠? 감사!

답변

on문서 (굵게) 상태) :

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

동등한에이 .live()같은 것

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

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

업데이트 : 다른 질문에 대답하는 동안 .live문서 에도 언급되어 있음을 알았습니다 .

.live()후속 방법 으로이 방법을 다시 작성하는 것은 간단합니다. 다음은 세 가지 이벤트 첨부 메소드 모두에 대한 동등한 호출을위한 템플리트입니다.

$(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.live애플리케이션이 마이그레이션되기를 기다리는 동안 jQuery 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;
        }
});

참고 : 위 기능 this.selector은 제거 된 jQuery v3에서 작동하지 않습니다 .

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

답변

타사 코드 편집과 관련이없는 더 나은 솔루션을 찾았습니다.

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

Visual Studio에서 jQuery Migrate NuGet 패키지를 설치하여 모든 버전 관리 문제를 해결하십시오. 다음에 Microsoft는 눈에 거슬리지 않는 AJAX 및 유효성 검사 모듈을 업데이트하여 마이그레이션 스크립트없이 다시 시도하여 문제가 해결되었는지 확인합니다.

jQuery Foundation이 jQuery Migrate를 유지 관리하기 때문에 이것이 타사 라이브러리에 대한 최선의 접근 방법 일뿐 만 아니라 라이브러리 업데이트 방법을 자세히 설명하는 자체 라이브러리에 대한 경고 메시지를 얻는다고 생각합니다.

답변

선택된 답변 외에도

당신이 사용하는 경우 비주얼 스튜디오를 , 당신은 사용할 수있는 정규식 교체 .
편집> 찾기 및 바꾸기> 파일에서 바꾸기
또는 Ctrl + Shift + H

찾기 및 바꾸기 팝업에서 다음 필드를 설정하십시오.

찾을 내용 : \$\((.*)\)\.live\((.*),
바꾸기 : $(document.body).on($2,$1,
찾기 옵션에서 “정규 표현식 사용”을 확인하십시오.

답변

jquery verision xxxjs 열린 편집기, 찾기 jQuery.fn.extend

코드 추가

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

예 : jquery-2.1.1.js-> 줄 7469 (jQuery.fn.extend)

이미지보기 예

답변