Question

我尝试自定义jquery mobile的主题。在“ui-popup”的文档中，我找到了两个关于主题的选项：

$.mobile.popup.prototype.options.overlayTheme = "jobstaff-de"; 
$.mobile.popup.prototype.options.theme = "jobstaff-de";

结果如下：

<div data-role="popup" id="loginDialog" class="ui-body-jobstaff-de"  data-theme="jobstaff-de" data-overlay-theme="jobstaff-de">...</div>

到目前为止一切顺利。我的问题是指这个div区域的内部html。我发现了这个：

<div data-role="content" class="ui-body-c" data-theme="c" role="main">...</div>

为什么主题会在这里重置为“c”？我需要改变别的吗？

感谢您的帮助!!

Orma的

编辑1 ：我也改变了以下主题。我将它们放入一个名为jquery.mobile.theme.js的文件中，该文件在jquery.js之后但在jquery.mobile.js之前加载：

<script type='text/javascript' src='js/jquery.js'></script>
<script type='text/javascript' src='js/jquery.mobile.theme.js'></script>
<script type='text/javascript' src='js/jquery.mobile.js'></script>

jquery.mobile.theme.js的内容:( jquery.js和jquery.mobile.js不变）

$(document).bind('mobileinit', function () {

    $.mobile.page.prototype.options.theme               = "jobstaff-de";
    $.mobile.page.prototype.options.headerTheme         = "jobstaff-de";  
    $.mobile.page.prototype.options.contentTheme        = "jobstaff-de";
    $.mobile.page.prototype.options.footerTheme         = "jobstaff-de";
    $.mobile.page.prototype.options.backBtnTheme        = "jobstaff-de"; 

    // Popups
    $.mobile.popup.prototype.options.overlayTheme       = "jobstaff-de"; 
    $.mobile.popup.prototype.options.theme              = "jobstaff-de"; 

    // listviews
    $.mobile.listview.prototype.options.headerTheme     = "jobstaff-de";  // Header for nested lists
    $.mobile.listview.prototype.options.theme           = "jobstaff-de";  // List items / content
    $.mobile.listview.prototype.options.dividerTheme    = "jobstaff-de";  // List divider
    $.mobile.listview.prototype.options.splitTheme      = "jobstaff-de";
    $.mobile.listview.prototype.options.countTheme      = "jobstaff-de";
    $.mobile.listview.prototype.options.filterTheme     = "jobstaff-de";

    // selectmenu
    $.mobile.selectmenu.prototype.options.menuPageTheme = "jobstaff-de"; 
    $.mobile.selectmenu.prototype.options.overlayTheme  = "jobstaff-de"; 
    $.mobile.selectmenu.prototype.options.theme         = "jobstaff-de"; 

    // dialog
    $.mobile.dialog.prototype.options.theme             = "jobstaff-de"; 

    // panel
    $.mobile.panel.prototype.options.theme              = "jobstaff-de"; 

    //input
    $.mobile.textinput.prototype.options.theme          = "jobstaff-de"; 

    // buttons
    $.mobile.button.prototype.options.theme             = "jobstaff-de"; 


});

Answer 1

我从未修改过这样的主题:-)

为什么不编写jobstaff-de主题（我假设你有）并在JQM页面上手动设置：

<div data-role="page" data-theme="jobstaff-de">
  // all widgets will inherit jobstaff-de
</div>

在JQM 1.4中，这个单一的主题声明应该足以将主题继承到页面上的所有小部件而不必再次指定它 - 所以不需要覆盖任何默认的IMHO。

如何在ui-popup主题中更改数据角色“内容”？

1 个答案: