如何在jquery手机中动态更改主题？

您可以定位与特定小部件相关的特定类，重置其类，然后添加您选择的主题类：

//set your new theme letter
    var theme = 'e';

    //reset all the buttons widgets
    $.mobile.activePage.find('.ui-btn')
                       .removeClass('ui-btn-up-a ui-btn-up-b ui-btn-up-c ui-btn-up-d ui-btn-up-e ui-btn-hover-a ui-btn-hover-b ui-btn-hover-c ui-btn-hover-d ui-btn-hover-e')
                       .addClass('ui-btn-up-' + themE)
                       .attr('data-theme',themE);

    //reset the header/footer widgets
    $.mobile.activePage.find('.ui-header,.ui-footer')
                       .removeClass('ui-bar-a ui-bar-b ui-bar-c ui-bar-d ui-bar-e')
                       .addClass('ui-bar-' + themE)
                       .attr('data-theme',themE);

    //reset the page widget
    $.mobile.activePage.removeClass('ui-body-a ui-body-b ui-body-c ui-body-d ui-body-e')
                       .addClass('ui-body-' + themE)
                       .attr('data-theme',themE);

http://jsfiddle.net/VNXb2/1/

这绝对不是一个功能齐全的代码片段，您将需要找到您想要更新的任何其他小部件，当您切换主题并将其添加到上面的代码中。您可以通过使用FireBug或其他开发者控制台，找到每个小部件容易的类。

updatE

当你考虑到data-role =“list-divider元素这有点棘手：

var theme = 'c';

//the only difference between this block of code and the same code above is that it doesn't target list-dividers by calling: `.not('.ui-li-divider')`
$.mobile.activePage.find('.ui-btn').not('.ui-li-divider')
                   .removeClass('ui-btn-up-a ui-btn-up-b ui-btn-up-c ui-btn-up-d ui-btn-up-e ui-btn-hover-a ui-btn-hover-b ui-btn-hover-c ui-btn-hover-d ui-btn-hover-e')
                   .addClass('ui-btn-up-' + themE)
                   .attr('data-theme',themE);

//target the list divider elements,then iterate through them to check if they have a theme set,if a theme is set then do nothing,otherwise change its theme to `b` (this is the jQuery Mobile default for list-dividers)
$.mobile.activePage.find('.ui-li-divider').each(function (index,obj) {
    if ($(this).parent().attr('data-divider-theme') == 'undefined') {
        $(this).removeClass('ui-bar-a ui-bar-b ui-bar-c ui-bar-d ui-bar-e')
               .addClass('ui-bar-b')
               .attr('data-theme','b');
    }
})

/*The rest of this code example is the same as the above example*/

这是一个演示：http://jsfiddle.net/VNXb2/7/