Javascript JQuery Mobile Phonegap Android应用程序-下拉列表有重复条目

我正在使用jQuery Mobile和Phonegap制作一个Android应用程序，但遇到了一个问题。用例如下所示：

屏幕1。选择浏览业务列表或允许进行预订的业务列表。 屏幕2。选择一种业务类型，例如医生或牙医 屏幕3。从下拉列表中选择一个位置以在中查找这些类型的企业 屏幕4。选择一项业务。 我的问题是，当用户进入可以选择业务的屏幕，然后决定返回并更改业务类型时，当他们第二次看到选择位置屏幕时，位置都是重复的。如果他们重复此过程，则下拉菜单中每个位置都有三个条目，依此类推

如果他们可能会有所帮助，请查看屏幕截图

这些位置都是使用从数据库查询返回的JSON数据检索的。我尝试过在使用所有变量填充下拉列表后清空它们，以便下次遇到页面时，它们不会包含数据。我还尝试使用jQuery.empty函数强制下拉列表为空，但出于某些原因，下拉列表仍有重复的条目。下拉列表恢复正常的唯一时间是用户返回主页并再次完成该过程。这使我认为数据正在被缓存，或者主页上的某些内容导致一切都重新开始

你知道为什么每次到达页面时，下拉列表中的所有条目都会被复制吗。让我知道是否有什么我可以提供，以帮助了解这个问题

编辑： 显示写入下拉选择菜单的代码：

$('#categorySearch').live('pageshow', function(event) { 
theWindow = "categorysearch.html";

// //different ways of removing the options from within a select box, tried using them all since some didn't seem to function correctly but to no avail
// $('#search1').children().remove();
// $('#search1 option').remove();
// $('#search1').empty();
// $('#search1').html("");

// //different ways of removing the options from within a select box, tried using them all since some didn't seem to function correctly but to no avail
// $('#search2').children().remove();
// $('#search2 option').remove();
// $('#search2').empty();
// $('#search2').html("");

//variables for the necessary parameters to send to the query
var id = getUrlVarsCategorySearch()["id"];
var getCats = "";
var getParams = "";

//check which type of listing is being requested
if(submitBtn == "Book+Appointment")
{
    getCats = "Bookable+Listings";
}
else
{
    getCats = "All+Listings";
}

//the $_GET[] parameters to send
getParams = "?cat=" + id + "&submitBtn=" + getCats;

$('#search1').empty();

//add in empty option to tell user to select a county
$('#search1').append('<option value="" selected="selected">Select a county</option>\n');//add empty first option so the user will always have to change

//request state locations from the database
$.getJSON(serviceURL + 'getlocations.php' + getParams, function(data)
{
    var stateLocations = data.items;

    //fill the search box with these locations
    $.each(stateLocations, function(index, stateLocation)
    {
        $('#search1').append('<option value="' + stateLocation.state + '">' + stateLocation.state + '</option>\n');
    });
    //trying to empty any variables once used so there shouldn't be data in them the next time the page is loaded
    stateLocations = null;
    data = null;

}).error(function(){ window.location = './error.html'; });

$("#search1").selectmenu("refresh", true);

$('#search1 option:first').attr('selected', 'selected');
});

编辑2： 添加了示例HTML代码

<div id="categorySearch" data-role="page">
<form action="./linklist.html" method="get">
    <div id="searchBox1">
        <label for="search1">Located in:</label>
        <select name="search1" id="search1">

        </select>
    </div>
</div>
<p align="center">
    <input id="findBtn" type="submit" data-icon="search" value="Find" data-inline="true" disabled="disabled"/>
    <input id="clearBtn" type="reset" data-icon="delete" value="Clear" data-inline="true"/>
</p>
</form>

---

您的JSON数据是否被重复附加而不是覆盖以前的数据？请尝试发布代码，以便其他看到问题的人能够更好地了解您的想法是如何实现的。只要我的2美分。