Question

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

但我无法让它正常工作。所有内容都显示得很好但是当您到达入口页面时（从概览中选择一个元素），您无法获得导航，但是当手动刷新页面时，它显示正常。

我尝试调试它，当我删除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');
    }
});

Answer 1

我已通过您的代码进行调试，并且我发现您在输入结尾处有空格，这就是我在您的对象中获得的内容，如下所示：

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');
    }
});

我希望这会有所帮助，

jquery mobile if循环内的语句不起作用

1 个答案: