jquery-mobile - 替换 jquerymobile 持久页脚中的 img 源不起作用

Question

这是一个基本的导航实现，单击 jquerymobile 导航栏中的按钮会将当前图标与“活动状态”图标交换，但这似乎不适用于我的 jquerymobile 实现。

仅打开活动图像的代码片段如下

$("#navigation_link").live("click", function(){
    $.mobile.changePage("testpage.php");
    toggleActiveBtn("navigation");
});

function toggleActiveBtn(btnId){

    $("#" + btnId).src = "img/" + btnId + "_active.png";
    /* toggle previously active image to "off" state
    ...
    */
    $("#home).trigger("refresh");

testpage.php 中的 HTML 很简单：

<div data-role="page" id="home">
<div data-role="header" data--position="fixed" data-id="app_header">
    ...
</div>
<div data-role="content" id="main">
    ...
</div>    


<div data-role="footer" data-position="fixed" data-id="app_footer">
    <div data-role="navbar" id="footer_menu">
        <ul>
            <li><a id="navigation_link" href="javascript:void(0);"><img id="navigation" src="img/navigation.png" /></a></li>
            ...
        </ul>
    </div>
</div>

我试过了$("#home).trigger("create")，$("#home").trigger("refresh")都不管用。

提前感谢您的帮助，伙计们。

Answer 1

你做得对，只有错误是错误的触发参数。

这个功能：

$("#home).trigger("create");

只影响页面内容。要设置整个页面的样式（内容 + 页眉 + 页脚），必须使用此函数：

$("#home).trigger("pagecreate");

我为你做了一个简单的例子：http: //jsfiddle.net/Gajotres/yAz8G/

按下按钮更改导航栏图像。