如何將唯一的ID添加到html標簽-有解無憂

我在 javascript 中有一個函式，可以創建一個包含 3 個文本區域的引導卡。

var AddCard = function() {  
  const card =
                ` <div >
       <div >
          <h5 style="font-weight: bold">Additional Entry</h5>
       </div>
       <div id="pnlEntry" >
          <div >

             <Label Class="row pl-3" runat="server">Detailed Action:</Label>
             <textarea  style="width: 100%;"  id="txtEngrActionDesc2" runat="server" cols="50" rows="2" ></textarea>

             <Label Class="row pl-3" runat="server" >IAW:</Label>
             <textarea  style="width: 100%;"  id="txtEngrIAW2"
             runat="server" cols="50" rows="2" maxlength="2000"></textarea>

             <Label Class="row pl-3" runat="server">Discrepancy Narrative:
             <Label Class="text-dark small" runat="server"> 
             </Label>(200 Character Limit)</Label>
             <textarea  style="width: 100%;"  
              id="txtEngrDiscrepNarrative2"
             runat="server" cols="50" rows="2" maxlength="200"></textarea>
                                
            
               <Label runat="server">Clcik to save this entry to the alert:</Label>
               <a id="btnSaveEntry"  >Save</a>
            
         </div>
      </div>
  </div> `

            const mainDiv = document.getElementById("divEntryPanel");
            mainDiv.innerHTML  = card
            document.getElementById("divEntryPanel").style.display = "inline"; 
}

隨著每張卡片的創建，我希望每個 textarea 都有唯一的 id。我已經撰寫了應該將唯一 ID 附加到標簽的 javascript 函式，但它們沒有成功。有什么建議？

var AddDetailsFunc = function () {
            AddCard();
            $.unblockUI();

            $.each(function (index, entry) {
                    CreateEntry(entry.Key,'', '', '');
            });
        }

        var CreateEntry = function (entryId, DA, IAW, DN) {
            var txtDA = $(' id="txtEngrActionDesc2'   entryId   '" type="text" maxlength="2000"').addClass('form-control').val(DA);
            var txtIAW = $('input id="txtEngrIAW2'   entryId   '" type="text" maxlength="2000"').addClass('form-control').val(IAW);
            var txtDN = $('<input id="txtEngrDiscrepNarrative2'   entryId   '" type="text" maxlength="200">').addClass('form-control').val(DN);

            var idTD = $('<td>').addClass('text-center').append(entryId);
            var DATD = $('<textarea>').append(txtDA);
            var IAWTD = $('<textarea>').append(txtIAW); 
            var DNTD = $('<td>').addClass('text-center').append(txtDN);
            
            textarea.append(idTD).append(DATD).append(IAWTD).append(DNTD);
            $('#divEntryPanel').append(textarea);

        }

uj5u.com熱心網友回復：

由于 id 是 textarea 標簽的屬性，它應該是這樣的

var textarea = $('<textarea>');
textarea.attr('id', 'someid');
$('#main').append(textarea);

而不是在字串變數中構建 xml 節點。在回圈中，您可以使用索引或鍵值使其唯一

$.each(function (index, entry) {
    var textarea = $('<textarea>');
    textarea.attr('id', 'name'   index);
    //textarea.attr('id', 'name'   entry.key);  // incase its unique 
    $('#main').append(textarea);
});

應該像 id='name1' 一樣輸出下一個標簽 id='name2'

轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/374496.html

標籤：javascript 网站

上一篇：鏈接生成器GetUriByName()回傳null

下一篇：【統計學習方法】第二章感知機