假设我在html页面上有一个按钮，该按钮将内容附加到带有jQuery的页面（在 jQuery Mobile 环境中）。
我需要一种方法来附加无限多个内容div ，就像一个计数器系统，所以生成的第一个可以标记为第一个内容div 然后下一个可以标记为第二个，依此类推。
我尝试使用增加但却成为噩梦的独特ID来做到这一点。
怎么样？
假设我添加 3 内容div，但我不喜欢内容＃2 ，所以我删除＃2 。然后内容＃3成为内容＃2 ，因此每个元素都必须更改其ID。
当只有3个内容div时，这并不复杂，但是我们说有30个内容div：你删除内容＃2，现在其他28个内容div必须更改所有的内容div
最重要的是，在每个内容div中，让我们说有30个元素也需要更改所有唯一ID。
因此，噩梦。
编辑：以下是我上次尝试按照要求执行此操作时的部分代码：
//Question Type Visibility
$(document).on("pageinit","#createSurvey", function(){
$("#container").empty();
//Reset qCount
qCount = 0;
$(document).undelegate('#addQ', 'click').delegate('#addQ', 'click', function() {
//Increment question counter
qCount++;
$('\
<div id="newQ' + qCount + '" style="text-align: center !important; -webkit-transform: translateZ(0) !important;">\
<h2 id="num' + qCount + '" style="color: #52D273;">Question ' + qCount + '</h2>\
\
<!--Question Title-->\
<label id="qTitleLabel' + qCount + '" for="qTitle" class="ui-hidden-accessible">\
Question Title:\
</label>\
<input type="text" name="qTitle[]" id="qTitle' + qCount + '" placeholder="Question Title" required>\
<br>\
<h3 id="cat' + qCount + '" style="color: #46BCE1;">Question Category</h3>\
\
<!--Question Category-->\
<label id="qCatLabel' + qCount + '" for="qCat' + qCount + '" class="ui-hidden-accessible">\
Question Category:\
</label>\
<select name="addQCat[]" id="addQCat' + qCount + '" class="' + qCount + '">\
<option selected disabled hidden value=\'\'>Pick a Category</option>\
<option value="Category 1">Category 1</option>\
<option value="Category 2">Category 2</option>\
<option value="Category 3">Category 3</option>\
<option value="Category 4">Category 4</option>\
<option value="Category 5">Category 5</option>\
</select>\
<br>\
<h3 id="type' + qCount + '" style="color: #46BCE1;">Question Type</h3>\
\
<!--Question Type-->\
<label id="qTypeLabel' + qCount + '" for="addQType' + qCount + '" class="ui-hidden-accessible">\
Question Type:\
</label>\
<select name="addQType[]" id="addQType' + qCount + '" class="' + qCount + '">\
<option selected disabled hidden value=\'\'>Pick a Type</option>\
<option value="smallTextDiv">Small Text</option>\
<option value="tORfDiv">True or False?</option>\
<option value="dropdownDiv">Dropdown</option>\
<option value="numDiv">Number</option>\
<option value="radDiv">Radio Buttons</option>\
<option value="largeTextDiv">Large Text</option>\
<option value="checkDiv">Checkboxes</option>\
</select>\
\
<!--Small Text-->\
<div id="smallTextDiv' + qCount + '" class="types' + qCount + '">\
<h2 id="previewSmallText' + qCount + '">Preview</h2>\
<label id="addQSmallTextLabel' + qCount + '" for="addQSmallText' + qCount + '" class="ui-hidden-accessible">\
Preview:\
</label>\
<input type="text" name="addQSmallText' + qCount + '" id="addQSmallText' + qCount + '" placeholder="The user would type their answer in here...">\
</div>\
\
<!--True/False-->\
<div id="tORfDiv' + qCount + '" class="types' + qCount + '">\
<h2 id="previewTOrF' + qCount + '">Preview</h2>\
<div id="switchContainer' + qCount + '">\
<label id="switchLabel' + qCount + '" for="switch' + qCount + '" class="ui-hidden-accessible">\
Preview (A.K.A. On/Off):\
</label>\
<input type="checkbox" data-role="flipswitch" name="switch' + qCount + '" id="switch' + qCount + '" data-on-text="True" data-off-text="False">\
</div>\
\
<label id="replaceOffLabel' + qCount + '" for="replaceOff' + qCount + '" class="ui-hidden-accessible">\
Replace Off:\
</label>\
<input type="text" name="replaceOff' + qCount + '" id="replaceOff' + qCount + '" placeholder="Replace Off Text">\
\
<label id="replaceOnLabel' + qCount + '" for="replaceOn' + qCount + '" class="ui-hidden-accessible">\
Replace On:\
</label>\
<input type="text" name="replaceOn' + qCount + '" id="replaceOn' + qCount + '" placeholder="Replace On Text">\
\
<label id="replaceTextLabel' + qCount + '" for="replaceText' + qCount + '" class="ui-hidden-accessible">\
Replace Text:\
</label>\
<input type="button" value="Replace Text" id="replaceText' + qCount + '" class="' + qCount + '" style="background-color: blue;">\
\
<!--True or False: Off Text-->\
<input type="hidden" name="offTxt[]" id="offTxt' + qCount + '">\
\
<!--True or False: On Text-->\
<input type="hidden" name="onTxt[]" id="onTxt' + qCount + '">\
</div>\
\
<!--Dropdown-->\
<div id="dropdownDiv' + qCount + '" class="types' + qCount + '">\
<h2 id="previewDropDown' + qCount + '">Preview</h2>\
<div id="dropdownContainer' + qCount + '" class= ' + qCount + '>\
<label id="addQDropDownLabel' + qCount + '" for="addQDropDown' + qCount + '" class="ui-hidden-accessible">\
Preview:\
</label>\
<select name="addQDropDown' + qCount + '" id="addQDropDown' + qCount + '" class="0">\
<option selected disabled hidden value=\'\'>Make your Choice</option>\
<option value="Choice 1">Choice 1</option>\
</select>\
</div>\
<br>\
<label id="addChoiceLabel' + qCount + '" for="addChoice' + qCount + '" class="ui-hidden-accessible">\
Add Choice:\
</label>\
<input type="button" value="Add Choice" id="addChoice' + qCount + '" class="' + qCount + '" style="background-color: gold;">\
\
<div id="choicesContainer' + qCount + '"></div>\
<label id="updateChoicesLabel' + qCount + '" for="updateChoices' + qCount + '" class="ui-hidden-accessible">\
Update Choices:\
</label>\
<input type="button" value="Update Choices" id="updateChoices' + qCount + '" class="' + qCount + '" style="background-color: blue;">\
\
<input type="hidden" name="choiceCounter[]" id="choiceCounter' + qCount + '">\
</div>\
\
<!--Number-->\
<div id="numDiv' + qCount + '" class="types' + qCount + '">\
<h2 id="previewNum' + qCount + '">Preview</h2>\
<div id="numContainer' + qCount + '" class="' + qCount + '">\
<label id="addQNumLabel' + qCount + '" for="addQNum' + qCount + '" class="ui-hidden-accessible">\
Number:\
</label>\
<input type="range" name="addQNum' + qCount + '" id="addQNum' + qCount + '" value="5" min="0" max="10" data-popup-enabled="true" data-highlight="true">\
</div>\
\
<label id="replaceMinLabel' + qCount + '" for="replaceMin' + qCount + '" class="ui-hidden-accessible">\
Replace Min:\
</label>\
<input type="number" name="replaceMin' + qCount + '" id="replaceMin' + qCount + '" placeholder="Replace Minimum Number">\
\
<label id="replaceMaxLabel' + qCount + '" for="replaceMax' + qCount + '" class="ui-hidden-accessible">\
Replace Max:\
</label>\
<input type="number" name="replaceMax' + qCount + '" id="replaceMax' + qCount + '" placeholder="Replace Maximum Number">\
\
<label id="replaceNumsLabel' + qCount + '" for="replaceNums' + qCount + '" class="ui-hidden-accessible">\
Replace Nums:\
</label>\
<input type="button" value="Replace Min/Max" id="replaceNums' + qCount + '" class="' + qCount + '" style="background-color: blue;">\
\
<!--Number: Min Text-->\
<input type="hidden" name="minTxt[]" id="minTxt' + qCount + '">\
\
<!--Number: Max Text-->\
<input type="hidden" name="maxTxt[]" id="maxTxt' + qCount + '">\
</div>\
\
<!--Radio Buttons-->\
<div id="radDiv' + qCount + '" class="types' + qCount + '">\
<h2 id="previewRadio' + qCount + '">Preview</h2>\
<div id="radsContainer' + qCount + '" class="0">\
<fieldset id="radsSet' + qCount + '" data-role="controlgroup">\
<label for="rad1' + qCount + '">\
Button 1\
</label>\
<input type="radio" name="rad1' + qCount + '" id="rad1' + qCount + '" class="rads' + qCount + '" value="rad1">\
</fieldset>\
</div>\
<br>\
<label id="addRadLabel' + qCount + '" for="addRad' + qCount + '" class="ui-hidden-accessible">\
Add Radio Button:\
</label>\
<input type="button" value="Add Radio Button" id="addRad' + qCount + '" class="' + qCount + '" style="background-color: gold;">\
<div id="btnContainer' + qCount + '" />\
<label id="updateRadsLabel' + qCount + '" for="updateRads' + qCount + '" class="ui-hidden-accessible">\
Update Radio Buttons:\
</label>\
<input type="button" value="Update Radio Buttons" id="updateRads' + qCount + '" class="' + qCount + '" style="background-color: blue;">\
\
<input type="hidden" name="radCounter[]" id="radCounter' + qCount + '">\
</div>\
\
<!--Large Text-->\
<div id="largeTextDiv' + qCount + '" class="types' + qCount + '">\
<h2 id="previewLargeText' + qCount + '">Preview</h2>\
<label for="addQLargeText' + qCount + '" class="ui-hidden-accessible">\
Large Text:\
</label>\
<textarea name="addQLargeText' + qCount + '" id="addQLargeText' + qCount + '" placeholder="The user would type their answer in here..."></textarea>\
</div>\
\
<!--Checkbox-->\
<div id="checkDiv' + qCount + '" class="types' + qCount + '">\
<h2 id="previewCheck' + qCount + '">Preview</h2>\
<div id="checksContainer' + qCount + '" class="0">\
<fieldset id="checksSet' + qCount + '" data-role="controlgroup">\
<label for="check1' + qCount + '">\
Checkbox 1</label>\
<input type="checkbox" name="check1' + qCount + '" id="check1' + qCount + '" class="checks' + qCount + '" value="check1">\
</fieldset>\
</div>\
<br>\
<label id="addChecksLabel' + qCount + '" for="addChecks' + qCount + '" class="ui-hidden-accessible">\
Add Checkbox Button:\
</label>\
<input type="button" value="Add Checkbox" id="addCheck' + qCount + '" class="' + qCount + '" style="background-color: gold;">\
\
<div id="boxContainer' + qCount + '" />\
<label id="updateChecksLabel' + qCount + '" for="updateChecks' + qCount + '" class="ui-hidden-accessible">\
Update Checkboxes:\
</label>\
<input type="button" value="Update Checkboxes" id="updateChecks' + qCount + '" class="' + qCount + '" style="background-color: blue;">\
\
<input type="hidden" name="checkCounter[]" id="checkCounter' + qCount + '">\
</div>\
<br>\
<div id="delQDiv' + qCount + '">\
<label id="delQLabel' + qCount + '" for="delQ' + qCount + '" class="ui-hidden-accessible">\
Delete Question\
</label>\
<input type="button" value="Delete Question" id="delQ' + qCount + '" class="'+ qCount +'" style="background-color: red !important;"></div>\
</div>').hide().appendTo("#container").fadeIn(1000).enhanceWithin();
答案 0 :(得分：0)
如果您的身份证号码不连续，这真的很重要吗？如果是，请等到您进行保存然后重新编号。
如果你只是想知道这个数字，那就做一些事情：
var count = $("div").length;
请确保