使用jQuery添加另一個選擇列表

我有一個下拉列表，並且一旦用戶將默認選項value =「」（在Change上）更改爲列表中的其他內容，我希望表單可以追加相同的再次用不同的名稱下拉列表+1或類似的東西，可能會添加無限數量的下拉列表...我打算使用它來動態構建標籤列表。使用jQuery添加另一個選擇列表

這是一個類似的腳本，我發現正在與輸入型=「文本」 http://jsfiddle.net/jaredwilli/tZPg4/4/

$(function() { 
    var scntDiv = $('#p_scents'); 
    var i = $('#p_scents p').size() + 1; 

    $('#addScnt').live('click', function() { 
      $('<p><label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt_' + i +'" value="" placeholder="Input Value" /></label> <a href="#" id="remScnt">Remove</a></p>').appendTo(scntDiv); 
      i++; 
      return false; 
    }); 

    $('#remScnt').live('click', function() { 
      if(i > 2) { 
        $(this).parents('p').remove(); 
        i--; 
      } 
      return false; 
    }); 
}); 

    <h2><a href="#" id="addScnt">Add Another Input Box</a></h2> 
    <div id="p_scents"> 
    <p> 
    <label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt" value="" placeholder="Input Value" /></label> 
    </p> 
    </div>

我想真正瞭解如何做同樣的，除了我想補充一個下拉列表，而不是輸入文字...

任何幫助將不勝感激！ :)

THX

來源

2013-06-06 Chris L.

你嘗試過什麼呢？ –

是的，我使用修改後的Scott版本，現在都在工作......我無法使用jQuery UI 1.9.1 ...它對我的應用程序的這一部分的1.7.1工作正常:) –

只要改變什麼的添加到選擇列表....

<label for="p_scnts"><select id="p_scnt" name="p_scnt_' + i +'"><option value="">ONE</option><option value="">TWO</option></select></label>

Updated Fiddle here

來源

2013-06-06 03:16:56 Scott

天才！正是我在找什麼......以及如此之快......謝謝很多人:) <3 –

出於某種原因，我試着代碼，因爲它是它不工作:(它扔我在瀏覽器的頂部＃和沒有添加列表...我使用jquery-ui-1.10.3/jquery-1.9.1.js –

它在小提琴中工作......你一定不能改變一些東西 – Scott

嘗試像下面，它會幫助你...

小提琴：http://jsfiddle.net/tZPg4/5136/

HTML：

<div id="divselection"> 
<p> 
<select class="target"> 
    <option value="option1" selected="selected">Option 1</option> 
    <option value="option2">Option 2</option> 
</select> 
</p> 
<div>

JQuery的：

$(document).on("change", ".target", function(){ 
    $("#divselection").html($("#divselection").html() + "<p><select class='target'>" + $(this).html() + "</select><a href='#' id='remScnt'>Remove</a></p>"); 
});  

$(document).on("click", "#remScnt", function(){ 
    $(this).parents('p').remove(); 
});

來源

2013-06-06 03:42:06 Pandian

它看起來在變化是不是一個好主意最後......如果用戶改回第一個列表，它會創建一個新列表......添加按鈕將最終成爲最好的選擇。爲你的答案:) –

使用jQuery添加另一個選擇列表

回答

相關問題