Question

jQuery mobile似乎将document.title设置为data-role="header"的文本内容，例如：

<div data-position="fixed" data-role="header">
    <h1>This text</h1>
</div>

我有一个黑客解决方法来防止这样做：

$('div[data-role="page"]').bind('pageshow',function(){document.title = "My title"});

是否有更好/更具语义的方法来做到这一点？

Answer 1

另一种解决方案是将原始文档标题复制到每个页面的data-title属性：

$(":jqmData(role='page')").attr("data-title", document.title);

这种方法优于在页面显示上更改标题的优点是它可以防止页面转换期间文档标题闪烁。

Answer 2

如果你将值包装在div周围，它将不会更新标题。像这样：

<div data-position="fixed" data-role="header">
    <div><h1>This text</h1></div>
</div>

Answer 3

我只是修补jQuery mobile来删除不需要的行为。它似乎在jquery.mobile.navigation.js。您可以重建jQuery Mobile以再次获得缩小版本。

如果你有野心，你甚至可以向jQuery Mobile提交一个错误，要求这是一个选项（如果你愿意的话，甚至可以自己编写补丁）。

Answer 4

这里的jqmData选项对我不起作用。 H1包装选项搞砸了我需要通过CSS纠正的外观。对我有用并且实际上由jQuery Mobile记录的是：

http://demos.jquerymobile.com/1.1.2/docs/pages/page-titles.html

归结为使用data-role =“page”将数据标题属性添加到div：

<div data-role="page" data-theme="a" data-title="MyPage - @ViewBag.Title">

在这个特定示例中，我将页面标题设置为“MyPage - ”，然后是通过ViewBag中的MVC设置的页面标题。

Answer 5

$（＆＃34;：jqmData（role =＆＃39; page＆＃39;）＆＃34;）。attr（＆＃34; data-title＆＃34;，document.title）;

这就像@ stanislaw-osinski所提出的那样 - 但是，我必须像这样使用它来使它在jQuery Mobile v1.4.5中运行：

<script>
$(document).bind("pageinit", function(){
     // Patch to prevent overwriting <title></title>
    $(":jqmData(role='page')").attr("data-title", document.title);
});
</script>

阻止jQuery mobile设置document.title？

5 个答案: