1

jQuerymobileにボタンがあります。

 <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');
4

1 に答える 1

2

イベントを適切なタイミングでバインドしていないか、間違った要素をターゲットにしている可能性があります（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');
    });

});
于 2013-03-14T15:11:29.307 に答える