jquery mobile listview隐藏和显示然后无法搜索答案

【问题标题】：jquery mobile listview hide and show then cannot searchjquery mobile listview隐藏和显示然后无法搜索
【发布时间】：2013-01-18 10:04:21
【问题描述】：

使用 Jquery Mobile 1.2 存在一个问题，如果您有一个列表视图，并且您隐藏然后显示子项，则无法搜索所述子项。

不用文字解释，看这个： http://jsfiddle.net/bodgybrothers/bw2ZV/

在加载时它会创建两个子列表视图和搜索框。然后它隐藏并显示第二个孩子。通过搜索此列表，即使没有搜索匹配，也始终显示第二个孩子。

我认为这是 jquery mobile 中的一个错误，但想知道是否有一种解决方法可以在 show 方法之后使所有元素都可搜索。

$('#li-nav').append('<li id="1"><a href="#page1">Page 1</a></li>')
$('#li-nav').append('<li id="2"><a href="#page2">Page 2</a></li>').listview('refresh');
$('#2').hide();
$('#2').show();

编辑：我制定了一种可以追溯到 javascript 而不是使用 jquery 库的方法。隐藏和显示功能如下所示：

function showStuff(id) {
    document.getElementById(id).style.display = '';
}
function hideStuff(id) {
    document.getElementById(id).style.display = 'none';
}

更新了 JSfiddle http://jsfiddle.net/bodgybrothers/uwnCY/

【问题讨论】：

标签： jquery listview search mobile hide

【解决方案1】：

您已经有了解决方法，但另一个更简单的解决方法（对于那些遇到同样问题的人） - 是使用 addClass("hide") 或 removeClass("hide") 而不是 .show / .hide。这不再中断搜索。

css:
.hide {display:none;}   

JQuery: 
$('#li-nav').append('<li id="1"><a href="#page1">Page 1</a></li>');
$('#li-nav').append('<li id="2"><a href="#page2">Page 2</a></li>');
$('#li-nav').listview('refresh');
$('#2').addClass('hide');
$('#2').removeClass('hide');
('<li>').listview('refresh');

见 jsfiddle：http://jsfiddle.net/Q8Cfj/1/

【讨论】：