JS读取即将到来的数组元素失败

JS fails reading upcoming array elements

本文关键字:数组元素 失败 即将到来 读取 JS      更新时间:2023-09-26

目标是在#leftdiv-box中创建json文件的导航。根据#rightdiv-box中的文件层次结构,应该有到上一页/下一页的链接。

我的实现运行得很奇怪。当您单击导航中的链接时,只显示指向前一页的链接。通过点击前面的链接,到下一页的链接也在更新。导航通过这两个前/下一个链接工作。一旦切换回左侧导航,下一页链接将不再更新。前一个仍然是。你自己试试吧:http://jsfiddle.net/cxdL3/6/

从我发现的问题是读取数组([subchap+1])前面的元素不总是工作。这让我很困惑,因为它应该在函数被调用之前加载。

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

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/

在点击处理程序中获取chapsubchap值时,将它们作为整数,而不是字符串:

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/

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