動態添加選擇框

我正在使用JSP創建應用程序。在頁面之一中，用戶需要輸入一些症狀。現在我想給一個按鈕。當用戶點擊此按鈕時，會創建一個新的選擇框。動態添加選擇框

我尋覓了很多，只能找到如何動態地添加選項來選擇，但我希望新的選擇框

有人請幫助。

2013-03-20 user2191908

你已經會幫助你得到這個問題的答案 – 2013-03-20 17:07:09

$(".your-button").click(function() { 
    var selectBoxHtml = ["<select>"]; 
    var sourceItems = [4,5,6]; 
    for (var sourceIndex = 0; sourceIndex < sourceItems.length; sourceIndex++) { 
     selectBoxHtml.push('<option value="' + sourceIndex + '">' + sourceItems[sourceIndex] + '</option'); 
    } 
    $(this).after(selectBoxHtml.join("") + "</select>"); 
});

一旦sourceItems是動態的，一定要轉義它。

來源

2013-03-20 17:13:53

下面是一個示例代碼：

<html> 
    <head> 
    <script type="text/javascript"> 
     function addSelectBox() 
     { 
      var parentDiv = document.getElementById ("main"); 
      var selectElement = document.createElement ("select"); 
      for (var i=0;i < 5;i++) 
      { 
       var option = new Option ("Text " + i, "Value" + i); 
       selectElement.options[selectElement.options.length] = option; 
      } 
      parentDiv.appendChild (selectElement); 
     } 
    </script> 
    </head> 
    <body> 
    <div id="main"> 
     <input type="button" onclick="addSelectBox()" name="clickme" value="Add Select Box" /> 
    </div> 
    </body> 
</html>

編輯：

對於JSP（如果你有一個ArrayList的選項）：張貼一些代碼

<html> 
     <head> 
<% 
     int totalElements = 5; 
     ArrayList r = new ArrayList (totalElements); 
     for (int i=1;i <= totalElements;i++) 
     { 
     r.add (String.valueOf (i)); 
     } 
%> 
     <script type="text/javascript"> 
      function addSelectBox() 
      { 
       var parentDiv = document.getElementById ("main"); 
       var selectElement = document.createElement ("select"); 
       var option; 
<% 
       for (int i=0;i <= r.size();i++) 
       { 
%> 
        option = new Option ('<%=r.get (i)%>', '<%=r.get (i)%>'); 
        selectElement.options[selectElement.options.length] = option; 
<% 
       } 
%> 
       parentDiv.appendChild (selectElement); 
      } 
     </script> 
     </head> 
     <body> 
     <div id="main"> 
      <input type="button" onclick="addSelectBox()" name="clickme" value="Add Select Box" /> 
     </div> 
     </body> 
    </html>

來源

2013-03-20 17:22:44 AC1

感謝您的快速回復。該代碼工作正常，但我有一個ArrayList中的所有症狀，當我試圖在定義選項時使用它...它不工作... – user2191908 2013-03-20 20:35:27

– user2191908 2013-03-20 20:36:27

你是指JavaScript數組或Java ArrayList？對於Javascript數組，使用它像r [i]而不是r.get（i），它是java符號。 – AC1 2013-03-20 20:48:21

動態添加選擇框

回答

相關問題