javascript - 如何将每行的值添加到td？

Question

我在 hiddenTableRecord 上有一个值。然后我用 $$$ 符号分割这些值。然后我想添加td中的值。

这是我尝试过的

//Value i
$("#hiddenTableRecord").val("tq.StoreID$$$ IN('1001')$$$AND item.ItemLookupCode$$$ IN('115152')$$$AND item.ExtendedDescription$$$ IN('dsfdsfa')$$$");

if ($("#hiddenTableRecord").val().length > 0) {
    var filterArray = $("#hiddenTableRecord").val().split('$$$');
    var selectField;
    var filterCommaValue;

    alert(filterArray);

    for (var i = 0; i < filterArray.length; i++) {

        if (filterArray[i].length != 0) {
            if (i % 2 == 0) {
                selectField = filterArray[i];
                //alert(selectField)
            }
            else {
                filterCommaValue = filterArray[i];
            }

            $("#queryTable > tbody:last-child").append('<tr><td class="FieldNameID">' + selectField + '</td><td class="OperatorID"> IN(' + filterCommaValue + ')</td></tr>');
        }
        //alert(selectField);

    }
}

ASPX代码

<table class="table table-hover FilterTable" id="queryTable">
    <thead>
        <tr>
            <th>Field Name</th>
            <th>Values</th>
        </tr>
    </thead>
    <tbody>

    </tbody>
</table>
<asp:HiddenField ID="hiddenTableRecord" runat="server" />

But I didn't get the proper output like what i expect. I don't where i did mistake.

预期结果

tq.StoreID                     IN('1001')
AND item.ItemLookupCode        IN('115152')
AND item.ExtendedDescription   IN('dsfdsfa')

我想要这样的结果。

Answer 1

尝试以下代码:

$("#hiddenTableRecord").val("tq.StoreID$$$ IN('1001')$$$AND item.ItemLookupCode$$$ IN('115152')$$$AND item.ExtendedDescription$$$ IN('dsfdsfa')");

if ($("#hiddenTableRecord").val().length > 0) {
    var filterArray = $("#hiddenTableRecord").val().split('$$$');
    for (i = 0; i < filterArray.length; i=i+2) {
	var tr = document.createElement('TR');
	var td1 = document.createElement('TD')
	var td2 = document.createElement('TD')
        td1.appendChild(document.createTextNode(filterArray[i]));
        td2.appendChild(document.createTextNode(filterArray[i+1]));
        tr.appendChild(td1);
        tr.appendChild(td2)
	$("#queryTable").append(tr);
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="hiddenTableRecord" style="height:100px; width:250px;"></textarea>
<table id="queryTable">
  <tr>
      <th>Field Name</th>
      <th>Values</th>
  </tr>
</table>