我需要帮助。我找不到我的错误。出于某种原因，当我附加一个 ul 时，我得到了重复的 li。我创建了一个 AJAX 搜索，可以在键入时搜索结果。问题是当我离开页面时，例如，如果我点击个人资料并返回，如果我搜索相同的关键字，我会得到重复的结果。这很奇怪，因为我在输入任何内容之前清空（）我的 ul。这可能非常简单，但我找不到它。
这是我的 jQuery，它附加了我的 ul：
$(document).delegate("#search", "pageshow", function() {
$("#search input").focus(function() {
$("ul#search_list").empty();
$(this).val("");
localStorage.search = "";
});
$("#search input").keyup(function() {
$("ul#search_list").empty();
localStorage.search = $("#search input").val();
var result = "";
$.ajax({
url: '/app/users/search/'+localStorage.search,
dataType: 'jsonp',
jsonp: 'jsoncallback',
success: function(data) {
$.each(data, function(i,item){
var result = '<li><a href="#friend_profile" class="friend_profile" data-search_user_id="'
+ item.id +
'"><img class="round" src="'
+ item.picture + '" /><h3>'
+ item.name +
'</h3><p>' + item.location + '</p></a></li>';
$("ul#search_list").append(result);
$("ul#search_list").listview('refresh');
});
},
error: function(){
$("ul#relationships_list").text('Sorry, you dont seem to have any friends.');
}
});
});
});
这是正在附加的 HTML ul：
<div data-role="page" id="search">
<div data-role="header" data-position="fixed">
<a data-rel="back">Back</a>
<h1>Search</h1>
<a href="index.html">Settings</a>
</div><!-- /header -->
<div data-role="content">
<ul id="search_list" data-role="listview" data-filter="true">
</ul>
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#dash" data-icon="grid">Dash</a></li>
<li><a href="#points" data-icon="star">Points</a></li>
<li><a href="#claim" data-icon="check">Claim</a></li>
<li><a href="#search" data-icon="search" class="ui-btn-active ui-state-persist">Search</a></li>
<li><a href="#profile" data-icon="home">Profile</a></li>
</ul>
</div>
</div><!-- /content -->
</div><!-- /page -->
这是出现的屏幕截图。如果您想要视觉效果：
感谢大家！