在jQuery手機中更改數據主題

Question

我想在按下按鈕（如縮進或其他）後爲用戶提供一些持久性反饋。我試過了：

$(this).data('theme','b'); 

但是這並不奏效。

問：有沒有辦法顯示縮進的按鈕，或在運行中更改它的data-theme？

Answer 1

我知道這是一個古老的問題，但我最近自己碰到了這個障礙。

這樣做，這將是如下正確的方法：

$(this).buttonMarkup({theme: 'b'}); 
$(this).parent().buttonMarkup({ theme: "b" }); 

Answer 2

這也許是有用的給你： change jquery mobile color swatch dynamically

我覺得它可以用按鈕來完成同樣的方式。

Answer 3

對於表單內提交按鈕，這個使用jQuery移動1.2.0爲我工作一直在尋找一種方法來在jQuery Mobile中全局動態地改變主題（例如，點擊按鈕）。結果比我想象的要複雜得多。不管怎麼說，這是我對這個，通過對SO各種解決方案和其他網站的啓發：

// Dynamically changes the theme of all UI elements on all pages, 
// also pages not yet rendered (enhanced) by jQuery Mobile. 
$.mobile.changeGlobalTheme = function(theme) 
{ 
    // These themes will be cleared, add more 
    // swatch letters as needed. 
    var themes = " a b c d e"; 

    // Updates the theme for all elements that match the 
    // CSS selector with the specified theme class. 
    function setTheme(cssSelector, themeClass, theme) 
    { 
     $(cssSelector) 
      .removeClass(themes.split(" ").join(" " + themeClass + "-")) 
      .addClass(themeClass + "-" + theme) 
      .attr("data-theme", theme); 
    } 

    // Add more selectors/theme classes as needed. 
    setTheme(".ui-mobile-viewport", "ui-overlay", theme); 
    setTheme("[data-role='page']", "ui-body", theme); 
    setTheme("[data-role='header']", "ui-bar", theme); 
    setTheme("[data-role='listview'] > li", "ui-bar", theme); 
    setTheme(".ui-btn", "ui-btn-up", theme); 
    setTheme(".ui-btn", "ui-btn-hover", theme); 
}; 

有參與，因爲我也想更新由JQM沒有表現出網頁的主題，一些額外的複雜性。通過成對的選擇器和主題類來構建代碼有助於讓我對此更加清楚。

你可以調用這個函數來動態更新主題爲所有UI元素，例如：

$.mobile.changeGlobalTheme("b"); 

我也很喜歡我所看到的是使用正則表達式，但在這種情況下，我喜歡的方式，解決方案明確說明選擇器和主題類，因爲添加新項目的清晰度和易用性。我通過檢查DOM樹來找出選擇器/類對。

我必須說我欣賞現代JavaScript代碼的Lisp風格。

Answer 4

我：

$(this).buttonMarkup({theme: 'b'});