在jQuery中將值從一個輸入傳遞到另一個

Question

jsFiddle供參考：

http://jsfiddle.net/UxQV7/

我要嘗試做的是，如果用戶單擊第二行上的“添加”，新的表單元素將顯示在下面。

然后，用戶在該新表單元素中鍵入一個數字，單擊“添加”按鈕，然后將在第二行的“序列號”輸入中填充該數字，然后隱藏新表單元素。

我遇到的問題是，一旦用戶在新的表單元素中輸入數字，我怎么知道將其發送回第二行。

非常感謝。

Answer 1

您可以這樣做：

var index;
$(".addSerial").click(function(){
  index = $(this).closest('tr').index();
  console.log(index);  
   $("#serialAdd").toggle();
});

$("#submitSerial").click(function(){
   $('table tr:eq('+index+') input:first').val($("#serialToAdd").val());
   $("#serialAdd").toggle();
});

在這里擺弄http://jsfiddle.net/qWGKq/

Answer 2

呈現這些控件時，您需要為每個控件提供一個ID為ID的序列號，這樣您就可以輕松識別控件並添加值。

檢查此工作樣本。 http://jsfiddle.net/UxQV7/18/

Answer 3

您將必須將參考值存儲在某個地方（例如，在全局變量中），以指示單擊了哪個<a>以顯示序列號條目<div>或動態創建它並隨后銷毀它。

Answer 4

將當前行保存在變量中，然后從其中過濾出文本框，以將值設置為： http : //jsfiddle.net/UxQV7/1/ 。

var currentRow; // will be <tr> of row where user has clicked on Add

$(".addSerial").click(function(){
   currentRow = $(this).parents('tr'); // set current row
   $("#serialAdd").toggle();
});

$("#submitSerial").click(function(){
   $("#serialAdd").toggle();
   currentRow.find(':text:eq(2)').val($('#serialToAdd').val());
   // find correct textbox in row and copy value
});

Answer 5

您可以使用jQuery的prev()獲取目標輸入並將其保存：

var activeField;

$(".addSerial").click(function(){
   $("#serialAdd").toggle(); 
    activeField = $(this).prev();
    return false;
});

$("#submitSerial").click(function(){
   $("#serialAdd").toggle(); 
   activeField.val( $("#serialToAdd").val() ); 
    $("#serialToAdd").val("")
});

演示： http ： //jsfiddle.net/7Xykw/