1

我想从动态生成的后退按钮（例如嵌套列表）中删除文本以实现类似这个静态标题的内容（仅显示箭头）：

<header data-role="header">
    <h1>Header</h1>
    <a data-rel="back" data-iconpos="notext" data-icon="arrow-l">Back</a>
</header>

由于此解决方案无法正常工作，

$(document).bind("mobileinit", function() {
    $.mobile.page.prototype.options.addBackBtn = true;
    $.mobile.page.prototype.options.backBtnText = "";
}

我试过这个，但它不起作用：

$(document).bind('pagebeforecreate', function(){ 
    $("a:jqmData(rel='back')").jqmData("iconpos", "notext");
});

错误在哪里？

编辑
为了使问题更容易，我想删除嵌套列表中按钮的文本，例如：http: //jsfiddle.net/GV2wN/

4

2 回答 2

1

如果您想配置后退按钮文本，您可以在页面元素上使用 data-back-btn-text="previous" 属性，或者通过页面插件的选项以编程方式设置它。

来源：http: //jquerymobile.com/test/docs/toolbars/docs-headers.html

$.mobile.page.prototype.options.backBtnText = "Previous";

（将“previous”替换为您希望显示的任何文本。

data-back-btn-text="Previous"或者，您可以在您的 div 上逐页执行此操作，data-role="page"如下所示：

<div data-role="page" data-add-back-btn="true" data-back-btn-text="Previous">

更新 (1)

对不起，我错过了您已经尝试过上述方法。

解决方法：通过data-iconpos="notext"在data-role="button"链接上插入，会产生不带按钮文字的图标，如下图：

<a href="index.html" data-icon="arrow-l" data-role="button" data-iconpos="notext">Back</a>

这是一个有效的 jsFiddle 示例，将按钮放在 Header 元素中：http: //jsfiddle.net/3q28f/

于 2012-09-11T13:50:17.973 回答
0

它不是很干净，因为它在渲染后修改了按钮的 css，但添加它似乎可以解决问题：

$(document).on('pagechange', function () {
    $.mobile.activePage.find(".ui-header a.ui-btn-left").addClass("ui-btn-icon-notext");
    $.mobile.activePage.find(".ui-header a.ui-btn-left").removeClass("ui-btn-icon-left");
});​

这是你更新的小提琴。

有时在呈现按钮和更改其标记之间存在延迟，因此您可能希望寻找更好的事件来绑定，也许是单击事件？

于 2012-09-12T13:35:43.613 回答