我试图创建一个带有动态单元的标签,并在每一行之后进行一次煅烧。但是,我似乎无法获得表中每个rw的元素总数,它只会修正首幅或出现“未定义”。

创建表的代码:

$(document).ready(function () {

    $(document).on('click', '.add', function () {
        var html = '';
        html += '<tr onclick="calc(this)">';
        html += '<td><input type="text" name="item_name[]" oninput="calc()" class="form-control item_name" /></td>';
        html += '<td><input type="text" name="item_quantity[]" class="form-control item_quantity" /></td>';
        html += '<td><input type="text" name="item_unit[]" class="form-control item_unit" /></td>';
        //NEW ONES!!!!!!!!!!!!!!!
        html += '<td><select name="item_glass[]" class="form-control item_glass"><option value="">Select Glass Type</option><?php echo fill_unit_select_box($connect); ?></select></td>';
        html += '<td><select name="item_splash[]" class="form-control item_splash"><option value="">Select Splash</option><?php echo fill_unit_select_box3($connect); ?></select></td>';

        html += '<td><input type="text" name="item_HQuan[]" class="form-control item_HQuan" /></td>';
        html += '<td><select name="item_HDiam[]" class="form-control item_HDiam"><option value="">Select Hole Diameter</option><?php echo fill_unit_select_box2($connect); ?></select></td>';
        html += '<td><input type="text" name="item_CQuan[]" class="form-control item_CQuan" /></td>';

        //Total
        html += '<td><input type="text" name="item_Total[]" id="item_total[]" class="form-control item_total" disabled/></td>';


        html += '<td><button type="button" name="remove" class="btn btn-danger btn-sm remove">Delete Row<span class="glyphicon glyphicon-minus"></span></button></td></tr>';
        $('#item_table').append(html);
    });


我尝试测试的代码get元素并为每一行进行更改:

function calc(x){

  var i = x.rowIndex;
  document.getElementById("item_total[]").value = "test";

}

function calc(x){

  var i = x.rowIndex;
  document.getElementById("item_total[]")[i].value = "test";

}

function calc(x){

  var i = x.rowIndex;
  document.getElementByName("item_total")[i].value = "test";

}


这些都不起作用,我也不知道如何解决?

最佳答案

我可以建议您使用querySelector()代替。通过它,您可以使用CSS选择器(例如,使用属性选择器)查找元素:

document.querySelector('[name="item_name[]"]')




根据评论进行了更新

如果您有多个具有相同名称的input,则可以使用querySelectorAll()并循环显示结果,例如

var els = document.querySelectorAll('[name="item_name[]"]');
for (var i = 0; i < els.length ; i++) {

   // do something with e.g. each value
   var val = parseFloat(els[i].value);   // or parseInt(), so it becomes a number

}


请注意,可能需要将内括号转义,这样才能跨浏览器正常工作:

'[name="item_name\\[\\]"]'




笔记:

您的getElementById()无法工作,因为item_name[]不是id

您的getElementByName()拼写错误,因此无法使用。元素应为getElementsByName()s

关于javascript - 每行的动态单元格计算,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/50061414/

10-13 02:38