9

我想在我的用户按下按钮后向他们提供一些持久的反馈(比如缩进或其他东西)。我试过了:

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

但这不起作用。

问:有没有办法显示缩进按钮,或者data-theme即时更改它?

4

4 回答 4

18

我知道这是一个老问题,但我最近自己也遇到了这个障碍。

这样做的正确方法如下:

$(this).buttonMarkup({theme: 'b'});
于 2012-08-31T15:11:10.190 回答
8

我一直在寻找一种在 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 风格。

于 2013-03-23T09:15:55.487 回答
3

也许这对您有用: 动态更改 jquery 移动颜色样本

我认为它可以用同样的方式用按钮来完成。

于 2011-10-06T07:25:34.523 回答
2

对于表单内的提交按钮,这适用于我使用 jQuery Mobile 1.2.0:

$(this).buttonMarkup({theme: 'b'});
$(this).parent().buttonMarkup({ theme: "b" });
于 2013-01-09T17:25:45.270 回答