Question

我有这个HTML

<table id="tabel-item-borrowed" class="table table-striped table-bordered table-hover">
  <thead>
    <tr>
      <th class="headtabel">Categories</th>
      <th class="headtabel">Description</th>
      <th class="headtabel">Action</th>
    </tr>
  </thead>
  <tbody>
    <tr id="t11">
      <td>
        <input id="categories[1]" type="text" name="categories1" size="40">
      </td>
      <td>
        <input id="description[1]" type="text" name="description1" size="40">
      </td>
      <td>
        <input id="delete[1]" type="button" name="delete" value="delete" size="5">
      </td>
    </tr>
    <tr id="t12">
      <td>
        <input id="categories[2]" type="text" name="categories2" size="40">
      </td>
      <td>
        <input id="description[2]" type="text" name="description2" size="40">
      </td>
      <td>
        <input id="delete[2]" type="button" name="delete" value="delete" size="5">
      </td>
    </tr>
  </tbody>
</table>

tbody标签内的html代码是由javascript生成的，生成代码后我想填充#categories []，＃description [] ids

里面的值

这个我的javascript代码填充值

//button simpan item 
    $('#bSimpanItem').click(function () {
        var addnum = $('input#iduser').val();
        var addposinfo = $('input#idposinfo').val();

        if (addposinfo == '0') {
            messageAlert('[ ERROR ]<br>You must completely fill position info field.', 'error');
        } else {
            var lastrow = ( $('#lastrow').val() ) ? parseInt($('#lastrow').val()) : 1;

            var row = parseInt($('#comboqty').val());
            var category = $('#combocategory1').val() +'-'+ $('#combocategory2').val();
            var description = $('#borrowdesc').val();

            addNewRow(row);

            console.log(' last row ' + lastrow);
            console.log(' total row ' + row);
            console.log(' category '+category);
            console.log(' description '+description);

            for (var i = 1 ; i <= row; i++) {
                console.log("index " + i);

                $('input#idposinfo').val('');
                //fill value "111" and "222" inside <input id="categories[1]"> and <input id="description[1]">
                $("input#categories["+lastrow+"]").val("111");
                $("input#description["+lastrow+"]").val("222");

               lastrow++;
               document.getElementById('lastrow').value = lastrow;
               console.log("success run bSimpan inside for");
            }

            console.log("success run bSimpan outside for");
            resetForm('formBorrowItem');

            $('#formBorrowItem').hide();
            //return false;
        }
});

但输入值

中没有显示任何内容

Answer 1

[xxxx]是一个属性选择器。如果id在值中包含它们，则需要按jQuery documentation。

中的说明对其进行转义

$("input#categories\\["+lastrow+"\\]");

Answer 2

试试这个

$("input#categories\\["+lastrow+"\\]").val("111");

$("input#description\\["+lastrow+"\\]").val("222");

Html代码

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>


$(document).ready(function () {
    $('#bSimpanItem').click(function () {
        var iIndex = 0;  
        $('#tabel-item-borrowed tbody tr').each(function (index) {
            iIndex = index + 1
            $(this).find("td:eq(0)").find('#categories\\[' + iIndex + '\\]').val('111');
            $(this).find("td:eq(1)").find('#description\\[' + iIndex + '\\]').val('22');
        });
    });
});
</script>
</head>

<body style="width:50%;">
    <input type="button" value="bSimpanItem" id="bSimpanItem"/>
  <table id="tabel-item-borrowed" class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th class="headtabel">Categories</th>
<th class="headtabel">Description</th>
<th class="headtabel">Action</th>
</tr>
</thead>
<tbody>
<tr id="t11">
<td>
<input id="categories[1]" type="text" name="categories1" size="40">
</td>
<td>
<input id="description[1]" type="text" name="description1" size="40">
</td>
<td>
<input id="delete[1]" type="button" name="delete" value="delete" size="5">
</td>
</tr>
<tr id="t12">
<td>
<input id="categories[2]" type="text" name="categories2" size="40">
</td>
<td>
<input id="description[2]" type="text" name="description2" size="40">
</td>
<td>
<input id="delete[2]" type="button" name="delete" value="delete" size="5">
</td>
</tr>
</tbody>
</table>
</body>

</html>

Answer 3

你可以像这样访问循环中的输入：

Singleton

无法使用jquery将值填充到<input />

3 个答案: