Question

目标是在#left div框中创建JSON文件的导航。根据#right div-box中的文件层次结构，应该有到上一页/下一页的链接。

我的实施非常奇怪。单击导航中的链接时，仅显示指向上一页的链接。通过点击前面的链接，下一页的链接也在更新。浏览这两个上一个/下一个链接可以正常工作。只要您切换回导航左侧的导航，下一页链接就不会再次更新。前一个仍然如此。亲自尝试一下： http://jsfiddle.net/cxdL3/6/

从我发现的问题是在数组中前面读取一个元素（[subchap + 1]）doesen＆＃39> t 总是工作。这让我感到困惑，因为它应该在调用函数之前加载。

你对这种行为有解释吗？这两个链接基本上也是以相同的方式创建的。

var chap; //position in the array of the currently open chapter
var subchap; //position in the array of the currently open subchapter

function update_right() {       
    var path = data.chapter[chap].subchapter;       
    //Previous Page
    if(subchap > 0) {
        $("#prev").html("<b>Previous: </b><a href='"+path[subchap-1].url+"'>"+path[subchap-1].title+"</a><br/>");
        $("#prev > a").click(back);
    } else { //subchap == 0
        $("#prev").html(""); 
    };

    //Next Page
    if(subchap+1 < path.length) {
        $("#next").html("<b>Next: </b><a href='"+path[subchap+1].url+"'>"+path[subchap+1].title+"</a><br/>");
        $("#next > a").click(next);
    } else {
        $("#next").html(""); 
    }
}

function back() {
    subchap--;
    update_right();
}

function next() {
    subchap++;
    update_right();
}

$(document).ready(function() // DOM needs to exist in order to be able to add stuff in there
{ 

//... Navigation created ...

    //------ onClick Navigation
    $('#left > ul > li > a').click(
        function()
        {
            chap = $(this).attr("data-chap");
            subchap = $(this).attr("data-subchap");
            update_right();
        }
    );  
});

其余文件非常标准。如果它们很重要，可以在这里找到它们：http://fabitosh.bplaced.net/SkriptET_iFrame_v3/

Answer 1

在点击处理程序中获取chap和subchap值时，请将它们作为整数而不是字符串：

chap = parseInt($(this).attr("data-chap"), 10);
subchap = parseInt($(this).attr("data-subchap"), 10);

以便chap + 1之类的内容在1时变为chap == 0，而"01"

时变为chap == "0"

更新示例：http://jsfiddle.net/cxdL3/10/

Answer 2

如果您使用$(object).data('chap')，jQuery将为您处理类型转换。

JS无法读取即将到来的数组元素

2 个答案: