0

我在使用单页方法时遇到问题。当我移动到“过滤器页面”时，我想通过 ajax 填充应用程序列表，我在这里模拟了调用。

function populateList()
{
     $('#drpApplication').empty().listview('refresh');
     if (typeof cache["FilterCounter"] == "undefined") {

                    cache["FilterCounter"] = 1;
                }
        var listItem = "<option value=" + '\'' + '1' + '\'' + ">" + 'Name1' + "</option>";
      $('#drpApplication').append(listItem);
            var listItem2 = "<option value=" + '\'' + '2' + '\'' + ">" + 'Name2' + "</option>";
      $('#drpApplication').append(listItem2);
            var listItem3 = "<option value=" + '\'' + '3' + '\'' + ">" + 'Name3' + "</option>";
      $('#drpApplication').append(listItem3);


}

单击应用会将我转到另一个页面，然后当我返回过滤器页面时，应用程序列表会附加一组新数据。尽管我告诉它先清空下拉列表。同样在下拉列表中选择一个应用程序是假设将选择添加到页面上的另一个列表视图

    $('#drpApplication').change(function () {

        $("#drpApplication option:selected").each(function () {
            var filterItemId = 'liApplicationName' + cache["FilterCounter"].toString();
            $('#lstApplicationList').append('<li value="' + $(this).val() + '" id="' + filterItemId + '"data-icon="delete"><a onclick="removeFilterItem(\'' + filterItemId + '\')">' + $(this).text() + '</a></li>').listview('refresh');
            cache["FilterCounter"] = cache["FilterCounter"] + 1;
        });

    }).change();

在后续访问中会发生什么情况，当您从下拉列表中选择一个应用程序时，它会在第二次访问时在列表视图中放置 2 个相同条目，在第 3 次访问页面时每 1 个选项放置 3 个条目，依此类推。

似乎 DOM 正在缓存其内容或其他东西，我无法阻止它？

我为此启动了一个 jfiddle，但我填充列表的功能没有运行。我刚开始使用 jfiddle，所以也许我的模拟设置不正确？

http://jsfiddle.net/D2gbq/27/

4

1 回答 1

0

看起来您正在清空选择，然后刷新列表视图，然后附加新选项。附加选项后，您需要刷新列表视图以使它们出现。

尝试这个：

function populateList()
{
  $('#lstApplicationList').empty();
  $('#drpApplication').empty();

  if (typeof cache["FilterCounter"] == "undefined") {
    cache["FilterCounter"] = 1;
  }
    var listItem = "<option value=" + '\'' + '1' + '\'' + ">" + 'Name1' + "</option>";
    $('#drpApplication').append(listItem);

    var listItem2 = "<option value=" + '\'' + '2' + '\'' + ">" + 'Name2' + "</option>";
    $('#drpApplication').append(listItem2);

    var listItem3 = "<option value=" + '\'' + '3' + '\'' + ">" + 'Name3' + "</option>";
    $('#drpApplication').append(listItem3);

    $('#lstApplicationList').listview('refresh');
    $('#drpApplication').listview('refresh');
}
于 2013-02-07T00:47:33.237 回答