将数据从输入传输到另一个输入

Question

我有一些输入。“输入并选择”"customer-1“的id值中的数据，如果点击add按钮，我想与"class”值匹配并传输。例如，输入id="customer-1“并选择”data in，我希望将其导入到class="customer-1“中。

​

$('.customer-add').click(function(){
	var customer_id = $('.customer-add').closest('.customer-bar').find("input").attr("id");

    $("." + customer_id).val($("#" + customer_id).val());
    
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="customer-bar">
    	<div id="customer-1">
    		<input type="text" id="customer-name" value="john" disabled />
    		<input type="text" id="customer-surnamename" value="doe" disabled />
    		<select name="" id="customer-day" disabled>
    			<option value="">14</option>
    		</select>
    		<select name="" id="customer-month" disabled>
    			<option value="">02</option>
    		</select>
    		<select name="" id="customer-year" disabled>
    			<option value="">1995</option>
    		</select>
    	</div>
    <br />
    	<div class="customer-add" style="cursor:pointer;background:red;color:white;display:inline-block;">Click to add customer details</div>
    <br /><br />
    	<div class="customer-1">
    		<input type="text" class="customer-name" value="" />
    		<input type="text" class="customer-surnamename" value="" />
    		<select name="" class="customer-day">
    			<option value=""></option>
    			<option value="">2</option>
    			<option value="">3</option>
    			<option value="">4</option>
    		</select>
    		<select name="" class="customer-month">
    			<option value=""></option>
    			<option value="">2</option>
    			<option value="">3</option>
    			<option value="">4</option>
    		</select>
    		<select name="" class="customer-year">
    			<option value=""></option>
    			<option value="">2012</option>
    			<option value="">2015</option>
    		</select>
    	</div>
    </div>
    
    
    <br><br><br>
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="customer-bar">
    	<div id="customer-2">
    		<input type="text" id="customer-name" value="john" disabled />
    		<input type="text" id="customer-surnamename" value="doe" disabled />
    		<select name="" id="customer-day" disabled>
    			<option value="">14</option>
    		</select>
    		<select name="" id="customer-month" disabled>
    			<option value="">02</option>
    		</select>
    		<select name="" id="customer-year" disabled>
    			<option value="">1995</option>
    		</select>
    	</div>
    <br />
    	<div class="customer-add" style="cursor:pointer;background:red;color:white;display:inline-block;">Click to add customer details</div>
    <br /><br />
    	<div class="customer-2">
    		<input type="text" class="customer-name" value="" />
    		<input type="text" class="customer-surnamename" value="" />
    		<select name="" class="customer-day">
    			<option value=""></option>
    			<option value="">2</option>
    			<option value="">3</option>
    			<option value="">4</option>
    		</select>
    		<select name="" class="customer-month">
    			<option value=""></option>
    			<option value="">2</option>
    			<option value="">3</option>
    			<option value="">4</option>
    		</select>
    		<select name="" class="customer-year">
    			<option value=""></option>
    			<option value="">2012</option>
    			<option value="">2015</option>
    		</select>
    	</div>
    </div>

​

我更新了代码。我可以传输一个输入，但我必须将它们全部传输

Answer 1

1. 将id更改为
2. use closest和next

我猜你的意思是从customer1复制到customer2

我不能做一个工作的代码片段，因为你们有相同的I并且没有名字，但是代码看起来是这样的

$(function() {
  $(".customer-add").on("click",function() {
    const $container = $(this).closest(".customer-bar")
    const $nextContainer = $container.next(".customer-bar")
    const $currentElements = $(":input",$container);
    const $nextElements = $(":input",$nextContainer);
    $currentElements.each(function(i) {
      console.log(i,$(this).attr("class"))
      $nextElements.eq(i).val($(this).val())
    })
  })
})

Answer 2

我更新了代码。我可以传输一个输入，但我必须将它们全部传输