0

我想要的是在页脚中最多显示三个按钮。我有一系列元素,所以我不想在第一个元素处显示上一个按钮,而在最后一个元素处显示下一个按钮。

但我无法让它正常工作。所有的内容都显示得很好,但是当你到达一个入口页面(你从概述中选择一个元素)时,你没有得到导航,但是当页面被手动刷新时它显示得很好。

我尝试对其进行调试,当我删除该if (entryId == nav.objId)语句时,将显示导航 - 显示了错误的项目,但至少我不需要刷新即可查看概览按钮。

您可以在http://kraen-ub-testen.dev.redia.dk/#overview查看实际代码

我有以下代码来显示导航:

$.each(navigation, function(i,nav) {
    var navArrLength = navigation.length;
    var index = nav.index;

    if (entryId == nav.objId) {
        var navLinks = "<div data-role=\"navbar\" class=\"ui-navbar ui-mini\" role=\"navigation\"><ul class=\"ui-grid-b\">";

        if (index >= navArrLength-1) {
            var prevEntry = navigation[index-1].objId;
            navLinks += "<li><a href=\"#entry?entryId=" + prevEntry + "\" data-icon=\"arrow-l\" data-transition=\"slide\">Næste</a></li>";
        }else{
            navLinks += "<li></li>";
        }

        navLinks += "<li><a href=\"#overview\" data-icon=\"grid\" data-transition=\"slideup\">Se alle</a></li>";

        if (index < navArrLength-1) {
        var nextEntry = navigation[index+1].objId;
        navLinks += "<li><a href=\"#entry?entryId=" + nextEntry + "\" data-icon=\"arrow-r\" data-transition=\"slide\">Næste</a></li>";
    }else{
        navLinks += "<li></li>";
    }

    navLinks += "</ul></div>";

    $navigation.html(navLinks).trigger('create');
    }
});
4

1 回答 1

0

我已经通过您的代码进行了调试,并且我发现您在条目的末尾有空间,这就是我在您的对象中得到的内容,如下所示:

nav.objId: "5020d6a3efd1cf3a5f000012"
entryId: "5020d6a3efd1cf3a5f000012 "
entryId == nav.objId: false

这就是为什么它现在会失败的原因这里的解决方案如下

用这个$.trim(entryId) == $.trim(nav.objId): true

所以我已将其更改为您的代码,如下所示:

$.each(navigation, function(i,nav) {
    var navArrLength = navigation.length;
    var index = nav.index;

    if ($.trim(entryId) == $.trim(nav.objId)) {
        var navLinks = "<div data-role=\"navbar\" class=\"ui-navbar ui-mini\" role=\"navigation\"><ul class=\"ui-grid-b\">";

        if (index >= navArrLength-1) {
            var prevEntry = navigation[index-1].objId;
            navLinks += "<li><a href=\"#entry?entryId=" + prevEntry + "\" data-icon=\"arrow-l\" data-transition=\"slide\">Næste</a></li>";
        }else{
            navLinks += "<li></li>";
        }

        navLinks += "<li><a href=\"#overview\" data-icon=\"grid\" data-transition=\"slideup\">Se alle</a></li>";

        if (index < navArrLength-1) {
        var nextEntry = navigation[index+1].objId;
        navLinks += "<li><a href=\"#entry?entryId=" + nextEntry + "\" data-icon=\"arrow-r\" data-transition=\"slide\">Næste</a></li>";
    }else{
        navLinks += "<li></li>";
    }

    navLinks += "</ul></div>";

    $navigation.html(navLinks).trigger('create');
    }
});

我希望这会有所帮助,

于 2012-08-09T12:56:43.263 回答