使用iscrollview jquerymobile插件获取滚动条的位置？

Html：

<div data-role="page" id="index">
    <div data-theme="b" data-role="header" data-position="fixed">
        <h1 class="header">Index page</h1>
    </div>

    <div data-role="content">
        <div class="example-wrapper" data-iscroll>
            <ul data-role="listview">
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>
                <li><a href="#">Some link</a></li>                
              </ul>
        </div>          
    </div>

    <div data-theme="b" data-role="footer">
        <h1><a href="#" class="top">Footer</a></h1>
    </div>    
</div>    

---

签出此项。

iScrollview将内容包装在

.iscroll滚动条

div中，并使用

transform（）

滚动该div。您需要检索上述div的

transform

CSS属性

$(".iscroll-scroller").css("transform");

上面将返回a，

y

携带垂直变换/平移的值。然后您需要

.split（“”

矩阵，并将其转换为一个数组，以便能够读取它

var matrix = $(".iscroll-scroller").css("transform").split(" ");

数组将如下所示

["matrix(1,", "0,", "0,", "1,", "0,", "-100)"]

然后只需

parseInt（字符串，基数）

数组中的最后一个值，（

matrix.length-1

=最后一个值的索引）

（1）

---

（1）

setTimeout（）

在演示中用于在动画（转换）完成后延迟检索

posY

。

虽然@omar的答案确实满足了我们的需要，但在对代码进行了大量的干预之后，我终于找到了更简单的方法。 iscrollview插件有一组getter，可用于直接访问所需的信息

$(document).on('click','.top',function(){
    console.log('Scroller Position Y ='+$('.example-wrapper').iscrollview('y'));
    console.log('Scroller Height = '+$('.example-wrapper').iscrollview('scrollerH'));
    console.log('Wrapper Height = '+$('.example-wrapper').iscrollview('wrapperH'));


    });

插件的github页面上的文档并没有真正解释如何使用这些工具，这就是造成混淆的原因

---

谢谢你，伙计，虽然我希望答案不需要太过草率。似乎插件应用了自己的填充，导致滚动条位置永远不会显示0。是否要检测页面的底部/顶部？@nathvarun不客气。您所说的检测页面顶部/底部是什么意思？偏移量？我想检测滚动条何时到达页面底部，即用户滚动到最后一个元素。@nathvarun在这种情况下，您需要计算可滚动div高度、包装高度和滚动位置。今晚晚些时候我会用代码更新我的答案。

var posY = parseInt(matrix[matrix.length - 1], 10);

$(document).on('click','.top',function(){
    console.log('Scroller Position Y ='+$('.example-wrapper').iscrollview('y'));
    console.log('Scroller Height = '+$('.example-wrapper').iscrollview('scrollerH'));
    console.log('Wrapper Height = '+$('.example-wrapper').iscrollview('wrapperH'));


    });