Changing JQuery Mobile data-theme dynamically

问题

I want to map a tap event to a function that changes the data-theme of a specific element in my document. It looks something like this:

$(document).delegate("#item1", "tap", function() { 
        $("#item1").attr("data-theme", "e");
    });

So far, it kind of works correctly. In the source code I can see it changing the attribute. However, it doesn't get re-rendered on the document and everything appears to the stay the same. Do I have to reload the document or is there a way to make it dynamically update?

回答1:

First use .on and vclick instead of delegate and tap. You can read on vclick here, read on .on here

You need to trigger refresh event, than jquery mobile will apply styling to that element again, for example if you change a list view, you can do this

$("#listview").listview('refresh')

In case you want styling changed on an element that has no refresh event, you can trigger page create event on the whole page, that will refresh everything.

$('#pageid').trigger('create')

Check here to see which elements have refresh event

来源：https://stackoverflow.com/questions/17556149/changing-jquery-mobile-data-theme-dynamically