首页 > 解决方案 > 将数组中 div 的位置附加到隐藏的输入类型

问题描述

当我单击一个按钮时,我想将 a 附加<div>到 container <div class='container'></div>。然后,我想将其数组中的 div 编号的值附加到<input type='hidden' value='"+number_within_array+"'>. 因此,如果我单击一次按钮并创建一个 div,它的输入值应该是 0 或 1,具体取决于您使用的系统。然后,如果我再次单击该按钮,新 div 的输入值将是 1 或 2。这是一个可视化我想说的示例:

https://jsfiddle.net/crdiling/yzsgue0b/8/

标签: javascriptjquery

解决方案


您应该声明一个外部变量并在函数内部递增它:

let counter = 0;

$('.add-div').click(function() {
  let append = `<div>value ${counter}</div>`; 

  $(append).appendTo('.container'); 

  let inputHidden = `<input type="hidden" value="${counter}">`;

  $('.resulting-values').append(inputHidden);
  
  counter++;
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container"></div>

<div class='resulting-values'></div>

<button class="add-div">Add div</button>


推荐阅读