列表视图过滤器不过滤新项目

使用jQuery-Mobile，当我向listview组件添加新项目时，它们在应用时不会被过滤。列表视图过滤器不过滤新项目

我的HTML代码是：

<div data-role="page" id="testPage"> 
    <div data-role="header"> 
     <h2>Test add item</h2> 
    </div> 
    <div data-role="content" id="content">  
    <ul data-role="listview" id="myList" data-filter="true"> 
     <li><h3>AAAA</h3></li> 
     <li><h3>BBBB</h3></li> 
     <li><h3>CCCC</h3></li> 
     <li id="liBtn"><a href="#" onclick="addItem();">Add Listitem</a></li> 
    </ul> 
    </div> 
</div>

而且我已经测试了这一点：

function addItem() { 
    $('#liBtn').remove(); 
    $('#myList').append('<li class="newItem"><h3>ZZZZ</h3></li><li id="liBtn"><a href="#" onclick="addItem();">Add Listitem</a></li>').listview('refresh'); 
    $('.newItem').hide().fadeIn('slow').removeClass('newItem'); 
} 

$('#testPage').live('pageshow', function() { 
    $("#myList").listview('option', 'filterCallback', 
     function(text, searchValue) { 
      var filter = text.toLowerCase().indexOf(searchValue) === -1; 
      console.log(text + ', filter:' + filter); 
      return filter; 
     } 
    ); 
});

加入了一些新的项目，当你搜索一个不存在的值（如 'XXXX'）后它在控制台中指示每个元素都应该被过滤。但是，新项目从不过滤。

任何人都知道发生了什么，我怎样才能使新项目被过滤？提前致谢。

的例子是在这里：http://jsfiddle.net/vuyuh/8/

来源

2012-02-01 Pablo

jQuery函数淡入补充说 “的风格：块;”属性执行后，以便列表元素始终可见。从技术上讲，listview应该已经处理了它，但显然它不是。

所以，你所要做的就是在新的列表元素淡入后删除样式属性发生

$('.newItem').hide().fadeIn('slow', function() { 
     $(this).attr('style', null); 
}).removeClass('newItem');

更新的jsfiddle：http://jsfiddle.net/vuyuh/10/

来源

2012-02-01 09:04:24

列表视图过滤器不过滤新项目

回答

相关问题