从动态改变的div中获取数据属性

时间:2017-05-14 01:21:11

标签: javascript jquery html

我需要帮助。我正在制作一个类似书本的系统,当你向下滚动它时,当你滚动到底部时调用ajax加载下一页。

数据属性存储在:

<span hidden id="page" data-vnum="{{ chapters.last.volume.id }}" data-npage="{{ chapters.currentPage + 1 }}" data-ppage="{{ chapters.currentPage - 1 }}" data-cpage="{{ chapters.currentPage }}" data-lpage="{{ chapters.lastPage }}"></span>

当调用下一页时,它会刷新跨度并使用新值更新它(整个span元素将被替换为具有相同id但数据值不同的新元素。

span元素被新值替换,但是当我检查调用仍然保留旧值时。这是当前的脚本:

var page = document.getElementById('page');

var book = {
    volumeNumber: page.dataset.vnum,
    nextPage: page.dataset.npage,
    prevPage: page.dataset.ppage,
    currentPage: page.dataset.cpage,
    lastPage: page.dataset.lpage
};

var nextPageUrl = baseSettings.baseURL + '/novel/2/volume/' + book.volumeNumber + '/chapter/' + book.nextPage;

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
        if(book.lastPage > book.currentPage) {
            $(this).request('onNextChapter', {
                data: { pageNumber: book.currentPage },
                url: history.pushState({}, '', nextPageUrl),
                success: function(data) {
                    this.success(data).done(function() {
                        document.getElementById('chapter-header').remove();
                        console.log(nextPageUrl)
                    });             
                },  
            });
        }      
    }
});

1 个答案:

答案 0 :(得分:0)

你应该在下一页加载时把它放到

$("page").attr({
  "data-vnum": newvalue,
  "data-npage": newvalue,
  "data-ppage": newvalue,
  "data-cpage": newvalue,
  "data-lpage": newvalue
});