0

我花了大约整个中午来解决这个问题（我使用 jQuery mobile 1.4.5）。

我在页脚动态创建一个菜单，这样：

$(document).on("pagebeforecreate", function(event) {

    var $maPage = $(event.target);
        var html    = '<div data-role="navbar">'
                + '<ul id="menu">'
                + '<li><a href="#home" data-rel="location" data-icon="location" data-transition="slide"></a></li>'
                + '<li><a href="#graph" data-rel="graph" data-icon="bars" data-transition="slide"></a></li>'
                + '<li><a href="#alarm" data-rel="alert" data-icon="alert" data-transition="slide" id="link-alarm" class="green"></a></li>'
        + '<li><a href="#preferences" data-rel="preferences" data-icon="gear" data-role="button" data-transition="slide"></a></li>'
                + '<li><a href="#info" data-rel="info" data-icon="info" data-transition="slide"></a></li>'
                 + '</ul>'
                + '</div>';
    
    // On transforme mon HTML brut en objet jQuery pour le manipuler facillemrnt
    var $navBar = $(html);
    // On recupère l'Id de la page en cours
    var idPage = $maPage.attr('id');
    
    // On recupère le bouton qui corresponf a l'id de la page en cours, pour lui ajouter les classes ui-btn-active et ui-state-persist
    //$navBar.find('a[href="#' + idPage + '"]').addClass('ui-btn-active ui-state-persist');
    
    $maPage.find('div[data-role="footer"]').html($navBar);
});

在报警链接上，是一个绿色类，在没有报警时添加绿色背景。

我创建了一个临时函数来更改类。它查看一个 localStorage 变量，当没有警报时该变量为 0，并且数量会根据警报的数量而增加

function checkRed() {
   /*
    * Journal
    */
    
    ls_journal = JSON.parse(window.localStorage.getItem('journal'));
    //alert(ls_journal.length);

    if(ls_journal.length > 0) {
        //alert('add red');
        $('#link-alarm').removeClass('green').addClass("red");
    }
    else
    {
        //alert('add green');
       $('#link-alarm').removeClass('red').addClass('green');
    }
}

在主页上，有地图与车站的本地化。MySQL请求请求站的状态，当温度过低时，警报响起，并且警报链接背景必须是红色的。

只要我在主页上就可以正常工作，但是当我移动到另一个页面时，不会发生转换。我的意思是警报链接背景保持绿色，类绿色。

有时它是红色的，但大多数时候是绿色的。

我相信我的问题可能与处理程序有关，但我试图checkRed()在不同的处理程序上调用该函数

$(document).on( "pagecontainertransition", function( event, data ) {
        checkRed();
        //$('#menu').listview(); // That do not work well
});

$(document).on( "pageshow", function( event, data ) {
        checkRed();
        //$('#menu').listview(); // That do not work well
});

$(document).on( "pagecontainertshow", function( event, data ) {
        checkRed();
        //$('#menu').listview(); // That do not work well
});

我的目标很简单，但我遇到了很大的问题才能让它发挥作用，我非常感谢你的帮助

ls_journal = JSON.parse(window.localStorage.getItem('journal'));

当 ls_journal 大于 0 时，警报背景链接必须始终为绿色，来自转换后的所有页面（pagebeforecreate、pageshow 等）。

并且当 id 等于 0 时，背景必须是绿色的。

我真的很想知道，是否有办法在某个时间点刷新导航？我试过没有成功

$('#menu').listview()
$('#menu').listview('refresh');

非常感谢您的帮助

4

0 回答 0