Question

我希望有人可以帮助我。我有一个表单，当选中表单复选框时，应该在复选框输入字段中插入一个name属性，并在末尾添加一个数字。我做了些什么，但并没有完全正常工作

when checkbox is checked it should look like this: 
<input type="CHECKBOX" class="item" name="my-list-item<0>" value="value">My Item<br>
<input type="CHECKBOX" class="item" name="my-list-item<1>" value="value">My Item<br>


<form>
<input type="CHECKBOX" class="item" value="value">My Item<br>
<input type="CHECKBOX" class="item" value="value">My Item<br>
<input type="CHECKBOX" class="item" value="value">My Item<br>
<input type="CHECKBOX" class="item" value="value">My Item<br>

</form>

<script>

function prepareSearchForm(form){
 var count = 0;

 $(form).children('.item').each(function(o){
   var cityDOM = document.createElement('input');

   itemDOM.name = "my-list-item<" + (count++) + ">";
   itemDOM.value = o.value;
   form.appendChild(itemDOM);
 });

}
</script>

Answer 1

我认为这就是你想要的：

   <form>
  <input type="checkbox" class="item" onclick="checkAddress(this)" />My Item<br>
  <input type="checkbox" class="item" onclick="checkAddress(this)" />My Item<br>
  <input type="checkbox" class="item" onclick="checkAddress(this)" />My Item<br>
  <input type="checkbox" class="item" onclick="checkAddress(this)" />My Item<br>

</form>
<script>
    function checkAddress(checkbox)
{


    if (checkbox.checked)
    {
     var count = 0; 
     var checkboxes =  document.getElementsByClassName("item");
        for(var ii = 1; ii < checkboxes.length; ii++){
           if(checkboxes[ii].checked){
           count++; 
        }
      checkbox.name = "my-list-item" + count;
    }
    }
}
    </script>

如果您想添加该值，只需在checkbox.value = "your value";下添加checkbox.name即可。

这是JSFiddle：https://jsfiddle.net/7teq1o9f/54/

这将输出：

<input type="checkbox" class="item" name="my-list-item<1>" onclick="checkAddress(this)">

Answer 2

您可以在jQuery中执行以下操作。

$('input:checkbox').change(function() {
    $(this).attr({
        'name': 'my-list-item<' + $(this).data("index") + '>'
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
    <input type="checkbox" class="item" value="value" data-index="0" />My Item<br/>
    <input type="checkbox" class="item" value="value" data-index="1" />My Item<br/>
    <input type="checkbox" class="item" value="value" data-index="2" />My Item<br/>
    <input type="checkbox" class="item" value="value" data-index="3" />My Item<br/>
</form>

Answer 3

抱歉，凌晨2点

      var count = 0;
   $('input[type="checkbox"]').change(function(){
       $(this).attr('name',count++);
    });

in plain js this.setAttribute（“name”，count ++）;

选中复选框时插入名称属性

3 个答案: