jQuery在另一個輸入中發送多個值

Question

我創建了一個用於顯示商店身份證的循環。

該卡的內容包含有關商店（電話，地址等）的信息。該卡有一個用於選擇商店的按鈕，我想將多個值發送到另一個input。

<li> 

<span onclick="doSomething()" value="3">Select this Shop</span> 
<input class="info-1" type="hidden" value="footlocker"> 
<input class="info-2" type="hidden" value="13 street 1000"> 
<input class="info-3" type="hidden" value="new york city"> 
<input class="info-4" type="hidden" value="00 22 55 66 33"> 
<input class="info-5" type="hidden" value="ID shop 6"> 

</li> 


<li> 
<span onclick="doSomething()" value="5">Select this Shop</span><br/> 
<input class="info-1" type="hidden" value="Mc Donald"> 
<input class="info-2" type="hidden" value="256 avenue clint"> 
<input class="info-3" type="hidden" value="San Diego"> 
<input class="info-4" type="hidden" value="31 64 21 54 12"> 
<input class="info-5" type="hidden" value="ID shop 34"> 
</li> 
... 

的信息在這裏

<input id="info-1" value=""> 
<input id="info-2" value=""> 
<input id="info-3" value=""> 
<input id="info-4" value=""> 
<input id="info-5" value=""> 

輸入送我的jQuery

function doSomething(){ 


    var text= $('.info-1').attr('value'); 
    $("#info-1").val(text); 

    var text = $('.info-2').attr('value'); 
    $("#info-1").val(text); 

    var text = $('.info-3').attr('value'); 
    $("#info-1").val(text); 

    var text = $('.info-4').attr('value'); 
    $("#info-1").val(text); 

    var text = $('.info-5').attr('value'); 
    $("#info-1").val(text); 
} 

此代碼不能正常工作，如果不工作，它發出了第一間店鋪才值:(。

感謝您的幫助

個

https://jsfiddle.net/zjo1y4vv/3/

Answer 1

JSFIDDLE DEMO

的Html看起來應該是這樣

<li> 
    <span onclick="doSomething(this)" value="3">Select this Shop</span> 
    <input class="info-1" type="hidden" value="footlocker"> 
    <input class="info-2" type="hidden" value="13 street 1000"> 
    <input class="info-3" type="hidden" value="new york city"> 
    <input class="info-4" type="hidden" value="00 22 55 66 33"> 
    <input class="info-5" type="hidden" value="ID shop 6"> 
</li> 
<li> 
    <span onclick="doSomething(this)" value="5">Select this Shop</span> 
    <br/> 
    <input class="info-1" type="hidden" value="Mc Donald"> 
    <input class="info-2" type="hidden" value="256 avenue clint"> 
    <input class="info-3" type="hidden" value="San Diego"> 
    <input class="info-4" type="hidden" value="31 64 21 54 12"> 
    <input class="info-5" type="hidden" value="ID shop 34"> 
</li> 
<br/> 
My container where is send the value : 
<input id="info-1" value=""> 
<input id="info-2" value=""> 
<input id="info-3" value=""> 
<input id="info-4" value=""> 
<input id="info-5" value=""> 

JAVASCRIPT

function doSomething(el) { 
    var infomag = $(el).siblings('.info-1').val(); 
    $("#info-1").val(infomag); 

    var text2 = $(el).siblings('.info-2').val(); 
    $("#info-2").val(text2); 

    var text3 = $(el).siblings('.info-3').val(); 
    $("#info-3").val(text3); 

    var text4 = $(el).siblings('.info-4').val(); 
    $("#info-4").val(text4); 

    var text5 = $(el).siblings('.info-5').val(); 
    $("#info-5").val(text5); 
    } 

你的小提琴有一堆錯誤。

1. doSomething(this) - 在你的HTML
2. 你有ID info-4兩次添加參數this。
3. 使用.siblings找到文本

Answer 2

一些提示和修正：

1. $('.info-1')將選擇多個元素。嘗試在正確的上下文中獲取唯一的一個元素，例如與$(this).next('.info-1')或$(this).parent().find('.info-1')

2. 內doSomething()功能，您只爲#info-2等設定值#info-1，沒有。

3. 爲了得到一個輸入值使用.val()代替.attr('value')

Answer 3

你可以嘗試這樣的事情：（如果添加其他的相關信息，您可以因式分解的代碼）

$(".span").click(function(e){ 
 

 
    var infomag = $(this).siblings('.info-1').attr('value'); 
 
    $("#info-1").val(infomag); 
 
    
 
    var text = $(this).siblings('.info-2').attr('value'); 
 
    $("#info-2").val(text); 
 
    
 
    text = $(this).siblings('.info-3').attr('value'); 
 
    $("#info-3").val(text); 
 
    
 
    text = $(this).siblings('.info-4').attr('value'); 
 
    $("#info-4").val(text); 
 
    
 
    text = $(this).siblings('.info-5').attr('value'); 
 
    $("#info-5").val(text); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li> 
 

 
<span class="span" value="3">Select this Shop</span> 
 
<input class="info-1" type="hidden" value="footlocker"> 
 
<input class="info-2" type="hidden" value="13 street 1000"> 
 
<input class="info-3" type="hidden" value="new york city"> 
 
<input class="info-4" type="hidden" value="00 22 55 66 33"> 
 
<input class="info-5" type="hidden" value="ID shop 6"> 
 

 
</li> 
 

 

 
<li> 
 
<span class="span" value="5">Select this Shop</span><br/> 
 
<input class="info-1" type="hidden" value="Mc Donald"> 
 
<input class="info-2" type="hidden" value="256 avenue clint"> 
 
<input class="info-3" type="hidden" value="San Diego"> 
 
<input class="info-4" type="hidden" value="31 64 21 54 12"> 
 
<input class="info-5" type="hidden" value="ID shop 34"> 
 

 
<br/> 
 
My container where is send the value :<br/> 
 

 
<input id="info-1" value=""><br/> 
 
<input id="info-2" value=""><br/> 
 
<input id="info-3" value=""><br/> 
 
<input id="info-4" value=""><br/> 
 
<input id="info-5" value=""><br/>