無法通過jQuery獲得工作的動態表單

我正在用jQuery製作一個動態的html表單。
這是用於測量每個房間通風的空氣表格。無法通過jQuery獲得工作的動態表單

我需要兩個輸入：房間名稱和風量值。
我的任務是動態添加一個選擇和輸入和刪除按鈕。稍後它應該提交給php處理器。

我的計劃是克隆div，它看起來它的工作原理，但我得到選擇輸入字段的問題。
在原始Div作品中選擇菜單，但i克隆div選擇值不會改變。我正在尋找解決方案，但我還沒有設法找出答案。按下刪除按鈕，我需要刪除元素的當前DIV。這也不工作:)

我不知道如果我在正確的方式使所有發生，因爲我剛剛開始與jQuery。
感謝您的幫助！

這裏是表單代碼：

<head> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
<script type="text/javascript"> 

function Addonemoretilluft() { 
    $('#tilluft_line').clone().insertAfter("#tilluft_line"); 
} 

function Removetilluft() { 
    $('#page').remove("#tilluft_line"); 
} 


$(document).ready(function() {  
    $("#add_tilluft").click(function(){ 
     Addonemoretilluft(); 
    }); 

    $("#remove_tilluft").click(function(){ 
     Removetilluft(); 
    });  
}); 
</script> 
</head> 
<body> 
<div class="page" data-iscroll="" id="page">  
       <form action="handle.php" method="post" data-ajax="false" id="tilluft_form"> 

        <div id="tilluft_line" class="ui-grid-b"> 
         <div id="select_value" class="ui-block-a"> 
         <select name="tilluft_name[]" id="tilluft_name[]" data-mini="true"> 
          <option value="val1">Val 1</option> 
          <option value="val2">Val 2</option> 
          <option value="val3">Val 3</option> 
          <option value="val4">Val 4</option>  
         </select> 
         </div> 
         <div id="input_value" class="ui-block-b"> 
          <input name="tilluft_value[]" id="tilluft_value[]" data-mini="true"> 
         </div> 
         <div class="ui-block-c" style="width:35px;"> 
          <a href="#" id="remove_tilluft" data-role="button" data-icon="delete" data-iconpos="notext">Delete</a> 
         </div> 
        </div> 
        <a id="add_tilluft" href="#" data-role="button" data-icon="add" data-mini="true" data-inline="true">Add one more</a> 
       </form> 
       <input type="submit" form="tilluft_form" value="Submit Form" data-mini="true" data-inline="true"/> 
      </div> 
</body>

測試版本http://jsfiddle.net/D4MPu/

來源

2012-11-20 exoticDEVIL

你克隆id屬性的元素了。 ID在每個頁面上必須是唯一的。 –

你的主要問題是，當你克隆行，要複製一個ID值。每HTML spec：

的錯誤，將可能導致腳本難以調試方式失敗有些錯誤是爲了幫助防止腳本問題，將很難調試。

這就是爲什麼，例如，它是不符合規定的有兩個ID 具有相同值的屬性。 ID重複導致錯誤的元素被選中，與有時造成災難性的影響，其原因難辨

這是不允許的。 ID元素必須是唯一的。相反，使用類似的一類（你可以有重複）來解決這個問題，或者更改ID（雖然，我會建議使用類）。

來源

2012-11-21 15:32:39 JasCav

無法通過jQuery獲得工作的動態表單

回答

相關問題