在JavaScript中動態生成輸入名稱

我正在嘗試創建一個頁面，用戶可以根據需要向表中添加儘可能多的行，然後輸入值（表格的每個單元格中都有一個輸入）是傳回到頁面。在JavaScript中動態生成輸入名稱

我試圖使每個動態生成的輸入框的名稱不同，我的問題來了。我試圖創建一個變量來完成它，但是我使用的語法在其他地方可行，在創建新元素時似乎不起作用。

這裏是有問題的代碼：

if ($_POST['dept_1'] != null){ //If there was an input 
    $i = intval($_POST['num_of_rows']); 
    while ($i != 0){ 
     $dept = $_POST['dept_' . $i]; 
     $hours = $_POST['hours_' . $i]; 
     echo $dept . " " . $hours . "\n"; 
     $i--; 
    } 
}

.....

var i = 2; 
     $("document").ready(function(){ 
      $("#newrow").click(function(e){ 
       $("#maintable").append('<tr> \ 
             <td><input type="text" name="dept_" + i size="5" maxlength="5" /></td> \ 
             <td><input type="text" name="hours_" + i size="5" maxlength="1" /></td> \ 
            </tr>'); 
            alert("dept_" + i); 
       e.preventDefault(); 
       $("#hiddenvalue").attr("value", "" + i + ""); 
       i = i + 1; 
      }); 
     });

$ POST [ '部門'。 $ i]在$ i = 1時工作，因爲dept_1被寫入頁面的HTML中。

alert（「dept_」+ i）起作用，將i的值連接到字符串。

name =「dept_」+我不工作。檢查新元素，其名稱是「dept_ + i」

爲什麼會發生這種情況，我該如何解決？

來源

2012-03-31 Andrew Latham

適當的解決方案是通過命名元素dept[]來使用數組;這會給你一個在PHP端的數組$_POST['dept']。

除此之外，語法突出顯示已經向您顯示問題：您的+i位於字符串內部;用這個來代替：

$("#maintable").append('<tr> \ 
    <td><input type="text" name="dept_' + i + '" size="5" maxlength="5" /></td> \ 
    <td><input type="text" name="hours_' + i + '" size="5" maxlength="1" /></td> \ 
    </tr>');

來源

2012-03-31 01:04:33 ThiefMaster

不要讓自己這麼難。使用數組名稱。

<td><input type="text" name="dept[]" size="5" maxlength="5" /></td> 
<td><input type="text" name="hours[]" size="5" maxlength="1" /></td>

使用$ _ POST [「部門」]和$ _ POST [「小時」]將返回乾淨的陣列獲取在PHP中的值。

來源

2012-03-31 01:03:22 iambriansreed

謝謝你教我的東西新。儘管如此，我真的很想學習我的問題的答案，因爲我曾嘗試過其他時間做類似的事情，並讓他們不工作。 – 2012-03-31 01:11:50

@AndrewLatham在ThiefMaster的回答中，你已經掌握了一切。 – iambriansreed 2012-03-31 01:13:12

你需要讓你最終在適當的地方繩子，讓你有'string1' + i + 'string2'來修復您的字符串一些像這樣的JavaScript語法錯誤：

var i = 2; 
    $("document").ready(function(){ 
     $("#newrow").click(function(e){ 
      $("#maintable").append('<tr> \ 
            <td><input type="text" name="dept_' + i + '" size="5" maxlength="5" /></td> \ 
            <td><input type="text" name="hours_' + i + '" size="5" maxlength="1" /></td> \ 
           </tr>'); 
           alert("dept_" + i); 
      e.preventDefault(); 
      $("#hiddenvalue").attr("value", "" + i + ""); 
      i = i + 1; 
     }); 
    });

來源

2012-03-31 01:04:52 jfriend00

這是行不通的，結果是'... name =「dept_」i size =「5」...' – 2012-03-31 01:11:18

@AndrewLatham - 我剛剛對我的答案做了一個更正，但即使我之前沒有做過，給你的想法是。我認爲你沒有從我的答案中得到正確的代碼。這會給'name =「dept_2」size =「5」'... – jfriend00 2012-03-31 04:40:14

在JavaScript中動態生成輸入名稱

回答

相關問題