javascript - 无法使用 jquery 更新隐藏的复选框名称属性

Question

我无法更新类名称为 funding_status_hidden 的克隆隐藏复选框输入中的 funding_status[0] 的名称属性。我可以使用以下 js 脚本更新类 funding_status 的正常输入。它还按预期更新了一堆其他复选框字段 - 努力让最后一个更改。

$(document).ready(function(){
var template = $('#products .product:first').clone();
var productsCount = $('.product').length-1; 

window.addProduct = function(){
    productsCount++;
    var product = template.clone().find(':input, .days').val('0').prop('checked', false).each(function(){

        var newId = this.id.substring(0, this.id.length-1) + productsCount;

        $(this).next(':input, label').attr('for', newId); // update label for
        $(this).next(".funding_status").attr('name', function() { return $(this).attr("name").substring(0, this.id.length-2) + "["+productsCount+"]" });
        $(this).next(".funding_status_hidden").attr('name', function() { return $(this).attr("name").substring(0, this.id.length-2) + "["+productsCount+"]" });


        this.id = newId; // update id and name (assume the same)



        $(this).find(".cloned_checkbox_hidden").attr("name", function() { return $(this).attr("name").substring(0, this.id.length-9) + "["+productsCount+"]" });
        $(this).find(".cloned_checkbox").attr("name", function() { return $(this).val('1').attr("name").substring(0, this.id.length-2) + "["+productsCount+"]" });




    }).end()
    .attr('id', 'product' + productsCount)
    .appendTo('#products');

}
$('.add').click(addProduct);
$("a#rp").click(function () {
    productsCount--;
if ($(".product").length != 1) {
$(".product:last").remove();
}
event.preventDefault();
});
});

克隆的 Div 的 HTML(缩减一点以显示我正在尝试更新的资金部分)

<div id="product2" class="product m-b-20">
<div class="field is-horizontal">
    <div class="field is-horizontal">
        <div class="field-body">
            <div class="columns">
                <div class="column">
                    <div class="field">
                        <div class="control">
                            <label for="is-gov-funded" class="label">Funding</label> 
                            <div class="select is-fullwidth m-b-15">
                                    <select id="gov_fundin2" name="gov_funding[]" class="input funding_dropdown">
                                        <option value="0">-</option>
                                        <option value="III">III</option>
                                        <option value="HC">HC</option>
                                    </select>
                            </div>
                        </div>
                    </div>
                </div> 
                    <div class="column">
                        <div class="field">
                            <div class="control">
                                <label class="label">Funding Amount</label> 
                                    <input type="number" step="0.01" name="funding_amount[]" value="" class="input funding_amount" id="2">
                            </div>
                        </div>
                    </div> 
                <div class="column">
                    <div class="field">
                        <div class="control">
                            <label class="label has-text-white m-b-20">Funding Status</label> 
                                <input id="funding_status_hidden_2" name="funding_status[0]" type="hidden" value="0" class="is-checkradio is-link funding_status_hidden"> 
                                <input id="funding_status_2" name="funding_status[0]" type="checkbox" value="0" class="is-checkradio f_input funding_status is-link" for="gov_funding_status_hidden_2"> 
                                <label for="funding_status_2" class="label">Approved</label>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

使用

document.getElementById("input-id").name ="new name";

改名

并且不要在名称中使用 [0]

像这样使用数据名

<input data-name="array[0]" >

上课

var t = document.getElementById("cloned-data-container");

t.querySelector(".your-spacial-input-classname").name = "custom value";