JQuery와 모바일 제거 ​​클래스는 클릭 이벤트 작동하지

Question

내가 jQuery를 모바일에 버튼이 : 나는 콘솔에서이 작업을 수행하는 경우

<a href="#" data-role="button" id="show_edit" data-theme="d" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" class="ui-btn ui-corner-left ui-btn-up-a ui-btn-up-d"><span class="ui-btn-inner ui-corner-left"><span class="ui-btn-text">Edit</span></span></a> 

, 작동 (버튼 색상 변경) :

$('#show_edit').removeClass('ui-btn-up-d').addClass('ui-btn-up-a'); 

을

그러나 내 페이지의 클릭 핸들러에서 'ui-btn-up-d'클래스가 제거되지 않습니다.

$('#show_edit').on('click', function() { 
        $(this).removeClass('ui-btn-up-d').addClass('ui-btn-up-a'); 
       }); 

편집 :

$('#show_edit').attr('data-theme', 'a').attr('class', 'ui-btn ui-corner-left ui-btn-up-a'); 

Answer 1

는 대부분의 경우이 이벤트를 바인딩되지 않은 : 나는 그러나 여기 너무 데이터 테마를 변경하는 또 다른 방법은, 아래 대답은 올바른 생각 올바른 시간에 또는 잘못된 요소 (예 : jQM에서 실수로 가져 오기가 매우 쉬운 중복 ID와 같은)를 타겟팅하는 경우

예를 들어 현재 페이지가 id="home"이면 다음과 같이 바인딩합니다.

// every time the id="home" page is initialized, run this handler 
$(document).on('pageinit','#home',function(){ 

    // ensure it targets only elements within this page, however it would 
    // be better if you didn't use ID's in jQuery Mobile due to the way it 
    // handles pages. 
    $('#show_edit',this).click(function() { 
     //$(this).removeClass('ui-btn-up-d').addClass('ui-btn-up-a'); 
     $(this).toggleClass('ui-btn-up-d ui-btn-up-a'); 
    }); 

});