Jquery mobile 如何更改使用jquery mobile开发的现有应用程序的主题?

Jquery mobile 如何更改使用jquery mobile开发的现有应用程序的主题?,jquery-mobile,Jquery Mobile,我正在使用jquery mobile和phone gap构建一个应用程序。当我即将启动应用程序时,我对如何在运行中更改应用程序的主题或进行最少的更改表示怀疑,以便我可以为不同的客户端使用具有不同主题的相同应用程序 请让我知道是否有一个配置或公共场所可用于在开发过程中随时更新/更改整个应用程序的主题 编辑:很抱歉搞混了,问题是如何在jquery mobile默认提供的主题(如a、b、c、d和e)之间切换,而不做任何或太多的代码更改 谢谢。jQuery Mobile有3个不同的CSS文件,您可以在下

我正在使用jquery mobile和phone gap构建一个应用程序。当我即将启动应用程序时,我对如何在运行中更改应用程序的主题或进行最少的更改表示怀疑,以便我可以为不同的客户端使用具有不同主题的相同应用程序

请让我知道是否有一个配置或公共场所可用于在开发过程中随时更新/更改整个应用程序的主题

编辑:很抱歉搞混了,问题是如何在jquery mobile默认提供的主题(如a、b、c、d和e)之间切换,而不做任何或太多的代码更改


谢谢。

jQuery Mobile有3个不同的CSS文件,您可以在下载整个软件包时获得它们

  • jQuery移动CSS文件
  • jQuery移动结构CSS文件
  • jQuery移动主题CSS文件
若你们想使用不同的主题,你们需要做的就是使用第二个和第三个提到的文件。Structure CSS包含jQuery移动结构CSS,它是整个结构的主干。您需要更改的是jQuery移动主题CSS文件。这是创建新主题时获得的文件

另一方面,jquerymobile将有多个CSS文件,但逻辑是相同的。如果您从该链接下载jQuery Mobile:

您将找到以下文件:

  • jquery.mobile.external-png-1.4.2.min.css
  • jquery.mobile.icons-1.4.2.min.css
  • jquery.mobile.inline-png-1.4.2.min.css
  • jquery.mobile.inline-svg-1.4.2.min.css
  • jquery.mobile.structure-1.4.2.min.css
  • jquery.mobile.theme-1.4.2.min.css
  • jquery.mobile-1.4.2.min.css
如果要使用自定义主题,则需要删除jquery.mobile-1.4.2.min.cssjquery.mobile.theme-1.4.2.min.css。Theme builder将为您提供新的jquery.mobile.Theme-1.4.2.min.css文件,或者即使您从某个地方下载它,您也会得到另一个jquery.mobile.Theme-1.4.2.min.css文件

使现代化 工作示例:

JavaScript: 或者更好:


jQueryMobile有3个不同的CSS文件,您可以在下载整个软件包时获得它们

  • jQuery移动CSS文件
  • jQuery移动结构CSS文件
  • jQuery移动主题CSS文件
若你们想使用不同的主题,你们需要做的就是使用第二个和第三个提到的文件。Structure CSS包含jQuery移动结构CSS,它是整个结构的主干。您需要更改的是jQuery移动主题CSS文件。这是创建新主题时获得的文件

另一方面,jquerymobile将有多个CSS文件,但逻辑是相同的。如果您从该链接下载jQuery Mobile:

您将找到以下文件:

  • jquery.mobile.external-png-1.4.2.min.css
  • jquery.mobile.icons-1.4.2.min.css
  • jquery.mobile.inline-png-1.4.2.min.css
  • jquery.mobile.inline-svg-1.4.2.min.css
  • jquery.mobile.structure-1.4.2.min.css
  • jquery.mobile.theme-1.4.2.min.css
  • jquery.mobile-1.4.2.min.css
如果要使用自定义主题,则需要删除jquery.mobile-1.4.2.min.cssjquery.mobile.theme-1.4.2.min.css。Theme builder将为您提供新的jquery.mobile.Theme-1.4.2.min.css文件,或者即使您从某个地方下载它,您也会得到另一个jquery.mobile.Theme-1.4.2.min.css文件

使现代化 工作示例:

JavaScript: 或者更好:


您只需通过
.page({theme:“a,b,c”})
小部件即可完成。它将改变整个页面的主题

$(document).on("pagecreate", function () {
    $(".selector").on("click", function () {
        $.mobile.pageContainer.pagecontainer("getActivePage").page({
            theme: "b"
        });
    });
});


您只需通过
.page({theme:“a,b,c”})
小部件即可完成。它将改变整个页面的主题

$(document).on("pagecreate", function () {
    $(".selector").on("click", function () {
        $.mobile.pageContainer.pagecontainer("getActivePage").page({
            theme: "b"
        });
    });
});


如果我只想在defualt提供的主题a、b、c、d和e之间切换?我不想改变整个代码,只想做一个开关。jQuery Mobile只有两个开关。您只想动态更改页面主题?是的。我只想让这个应用程序足够灵活,可以在不同的主题之间动态切换。看看更新的答案,特别是方法2。太好了。但它是在每个页面级别。是否在整个应用程序级别有任何配置将一次性应用于其所有页面。如果我只想在defualt提供的主题a、b、c、d和e之间切换?我不想改变整个代码,只想做一个开关。jQuery Mobile只有两个开关。您只想动态更改页面主题?是的。我只想让这个应用程序足够灵活,可以在不同的主题之间动态切换。看看更新的答案,特别是方法2。太好了。但它是在每个页面级别。在整个应用程序级别是否有任何配置将一次性应用于其所有页面。例如,您有单选按钮,用于动态更改主题,那么,这就是您需要的:
$(“link”).attr(“href”,“css/yourCustom.css”)我将发布我为动态更改主题而编写的全部代码。比如说,你有单选按钮,用于动态更改主题,那么,这就是你需要的:
$(“link”).attr(“href”,“css/yourCustom.css”)我将发布我为更改主题而编写的全部代码。
$(document).on("pagecreate", function () {
    $(".selector").on("click", function () {
        $.mobile.pageContainer.pagecontainer("getActivePage").page({
            theme: "b"
        });
    });
});