Question

有人可以帮忙吗？请在您的浏览器上运行以下代码，看看发生了什么。

只要将产品列表输入到具有显示顺序的列表视图中，就会出现问题。例如，用户输入prod1并显示顺序1，然后输入prod2并显示顺序2.这将在listview页面中添加2个listview项目。从一开始，用户可能希望prod1显示顺序1和prod2显示顺序2.稍后使用可能改变主意并想要将prod2更改为显示顺序2并将prod1更改为显示顺序1以便在其他一些中页面prod2在prod1之前显示。这就是当用户单击listview页面中的listview项目之一时显示动态创建的详细信息页面的原因。在此详细视图页面中，用户可以更改数字并单击更改按钮。

如果您在列表视图中输入prod1 1和prod2 2。转到详细页面prod2并更改为4，这是程序第一次运行。但是，如果您转到详细页面prod1并更改为3，则更改功能无法获取值3以进行更新，而是再次获得值4.

我该如何解决这个问题？

我将使用此网站的编辑模式逐个发布代码，以便您可以运行代码。

Answer 1

每当您导航到更改产品的显示时，您都会将相同的details页面附加到DOM中。下面的行将返回您输入的第一个值，它将引用动态注入的第一个details页面。

var fd2 = $.trim($('.ui-page ui-page-theme-a ui-page-active, #doProduct2').val());

即使您注入新页面并导航到该页面，您也会在第一个动态页面中检索#doProduct2的值。

您的解决方案是通过删除以前的页面，在DOM中只保留一个details页面。

/* remove old page */
$("#details").remove();

/* inject new updated one */
newPage.html(function (index, old) {
    return old.replace(/ID/g, title).replace(/TITLE/g, title).replace(/ORDER/g, order);
}).appendTo($.mobile.pageContainer);

/* navigate to page */
$.mobile.changePage(newPage);

<强> Demo

jQuery Mobile listview详细页面数据收费仅在第一次工作

1 个答案: