0

我有一个带有 jquerymobile 数据过滤器的列表视图，我正在使用 iscroll。使用数据过滤器搜索后，我想重新加载 Iscroll，因为它不会调整可滚动区域的大小。（因此可以滚动离开项目）

这是我的html：

        <div id="mywrapper" class="wrapper">
            <div data-role="content" id="myscroller">
                <ul data-role="listview" id="lstvw_myitems" data-filter="true"></ul>
            </div>
        </div>

我已经尝试将更改事件绑定到 listvw_myitems 更改，但它似乎没有被调用。

这是我尝试过的：

$('#lstvw_myitems').change(function() {
      loadIScroll('wrapper');
});

我可以尝试在 listview 上捕获任何其他（jquery）事件吗？

这是我使用的 Iscroll 代码。（超时是为了修复 iscroll 加载时的错误，其他代码是防止滚动时选择。）

function loadIScroll(wrapperId){
setTimeout(function () {
    var myScroll = new iScroll(wrapperId, {bounce: false, hScrollbar: false, vScrollbar: false, vScroll: true, useTransform: true, zoom: false,
        onBeforeScrollStart: function(e){
            var target = e.target;
            while (target.nodeType != 1) target = target.parentNode;
            if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA')
                e.preventDefault();
        }
    });
    }, 1);

}

我正在使用 jqm 1.3 jq 1.9.1 和 iscroll v4.2.5。

4

2 回答 2

0

我没有在列表对象上查找事件，而是更改了代码以在搜索输入框中查找输入。

这是一个例子：

$(document).on('pagebeforeshow',"*", function(e, data){
//bind keypress of datafilter to resize iscroll
$('.ui-input-search > input').bind("keyup",function(){
    myScroll.refresh();
});

});

注意： Iscroll var 必须在范围内可用才能刷新它。这个事件总是因为 * 选择器而被调用，使用另一个选择器会更好。我也不知道 '.ui-input-search > input' 选择器是否足以仅覆盖那些搜索输入框。

也许其他人会提出更好的解决方案！

于 2013-07-11T13:48:28.910 回答
0

我也在尝试这样做。它的列表很长，一旦有人输入数据，我的 Iscroll 就不会调整大小。我试过你的方法，但我不是 100% 确定我理解。任何建议我都会很感激。

这是我的 iscroll 代码：

  var myScroll;
var scroll_cookie = readCookie('scrollToAlt');
var back_cookie = readCookie('previousPagePath');
function loaded() 
   {
   myScroll = new iScroll('wrapper',
       {scrollbarClass: 'myScrollbar',
            hideScrollbar:false,
       });
        if ($('#scroller').height() <= $('#wrapper').height()){
           myScroll.destroy();
           myScroll = null;
        }
   }
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded', loaded, false);

$(document).on('pagebeforeshow',"*", function(e, data){
    //bind keypress of datafilter to resize iscroll
    $('.ui-input-search > input').bind("keyup",function(){
    myScroll.refresh();
    });
});
于 2013-07-12T17:27:18.643 回答