Question

我的应用程序成功创建了元素，并为它们分配了不同的（增加的）ID。

现在我的问题依赖于用户删除这些元素（因为他们可以选择删除和创建），这些ID的一致性会被破坏，因此我的应用程序运行不正常。

这Fiddle代表我到目前为止所拥有的。只是一个文本框，在collapsible中将其值和一些其他元素追加到用户想要的次数（由于某种原因，我的小提琴不会增加alert值，但它在我的工作正常平台）。

SCRIPT（抱歉txt变量太长）

$('#Add').click(function () {
if ($("#MedNameStren").val() != "") {
    var value = $("#MedNameStren").val();
    var noOfMeds = $('#NoOfMedicines').val();
    //to check current value
    alert(noOfMeds);
    var text = '<div data-role="collapsible" data-collapsed="true" data-iconpos="left" data-content-theme="e">' + '<h2>' + desc + '</h2>' + '<div class="ui-grid-a">' +          '<div class="ui-block-a" style="width:25%; margin-right:3%;">' + '<input id="quantity' + noOfMeds + '" class="quantity" type="text" placeholder="Quantity" />' + '</div>' + '<div class="ui-block-b" style="width:70%; margin-right:2%;"">' + '<textarea id="directions' + noOfMeds + '" class="directions" cols="40" rows="4" placeholder="Directions given by your GP." ></textarea>' + '</div>' + '</div>' + '<button key="' + vpid + '">Remove</button>' + '</div>';
    $("#medListLi").append(text);
    $('button').button();
    $('#medListLi').find('div[data-role=collapsible]').collapsible();
    $('#medListLi li').listview("refresh");
    $('#medListLi').trigger("create");
    document.getElementById("manuallyName").value = "";

    noOfMeds++
    $("#NoOfMedicines").val(noOfMeds);
}
else {
         alert('Please Provide Medicine Name')
}
});

我正在使用一个计数器，可以整齐地增加quantity和description的ID，如：

quantity0 quantity1 quantity2 ..等等，但是一旦调用了下面的脚本......

//Deletes colapsible sets (Medicines) from the selected List
$('#medListLi').on('click', 'button', function (el) {
$(this).closest('div[data-role=collapsible]').remove();
var key = $(this).attr('key');
localStorage.removeItem(key);

var noOfMeds = $('#NoOfMedicines').val();
noOfMeds--
$("#NoOfMedicines").val(noOfMeds);
//location.reload();
});

取决于删除哪个元素（collapsible），ID不再一致。例如，如果collapsible与id="quantity1"被删除，那么计数器将返回到1（当前为2），在下一次添加时，相应的collapsible将获得id已经采取了，不幸的是我不需要这样做。

也许我让这听起来更复杂，但是会感谢任何解决这个问题的建议或想法（如果可能的话）。

如果需要更多信息，请告知我们。

Answer 1

引起我的注意，可以创建和删除动态IDs但是要保持这些IDs的一致性可能会非常棘手。

我已经通过简单地创建一个函数来解决我自己的问题，该函数将IDs计算在我collapsibles内的list的数量，并“更新”{{1}每个ID和Add上的数字。

在DOM元素上对动态创建的ID的一致性进行排序

1 个答案: