jsp에서 javascript를 사용하여 동적으로 드롭 다운 상자를 만드는 방법은 무엇입니까?

Question

동적으로 드롭 다운 상자를 만들려고합니다. 추가 단추를 클릭하면 새 드롭 다운 상자가 만들어집니다. 또한 드롭 다운 목록에는 현재 연도가 필요하고 최대 5 년까지 표시되어야하는 것과 같은 동적 값이 포함됩니다. 이 일을 제안 해주세요.

감사합니다 ..

다음은 내가 시도한 코드입니다.

자바 스크립트 코드 :

function Add() 
{ 

    var name1 = document.createElement("select"); 
    name1.setAttribute('id',"year1") 
    name1.setAttribute('oncreate',"Date1()"); 
} 

function Date1(){ 
    d = new Date(); 
    curr_year = d.getFullYear(); 
    for(i = 0; i < 5; i++) 
    { 
    document.getElementById('year1').options[i] = new Option((curr_year-1)-i,(curr_year-1)-i); 
    } 
} 

html 코드 :

<input type="button" name="add" value="Add" onclick="Add();"> 

Answer 1

HTML 코드

<div id="select-container"> 
</div> 
<button id="add" onclick="addSelect('select-container');">Add Dropdown</button> 

자바 스크립트 코드

,536,

function dateGenerate() { 
    var date = new Date(), dateArray = new Array(), i; 
    curYear = date.getFullYear(); 
    for(i = 0; i<5; i++) { 
     dateArray[i] = curYear+i; 
    } 
    return dateArray; 
} 

function addSelect(divname) { 
    var newDiv=document.createElement('div'); 
    var html = '<select>', dates = dateGenerate(), i; 
    for(i = 0; i < dates.length; i++) { 
     html += "<option value='"+dates[i]+"'>"+dates[i]+"</option>"; 
    } 
    html += '</select>'; 
    newDiv.innerHTML= html; 
    document.getElementById(divname).appendChild(newDiv); 
} 

다음 피들을 통과하십시오. JS Fiddle to insert select element dynamically

추가 드롭 다운 버튼을 클릭 할 때마다 5 년 연속 옵션이있는 선택 요소가 생성됩니다.

Answer 2

function abc() 
{ 

var x=document.getElementById('Select1').value; 
var newDiv=document.createElement('div'); 
var html = '<select id="d2">'; 
for(i = x; i < 47; i++) { 
    html += "<option value='"+i+"'>"+i+"   </option>"; 
    } 
    html += '</select>'; 
    newDiv.innerHTML= html; 
      document.getElementById('drop').appendChild(newDiv); 
    } 




Html: 

    <select id='Select1' onchange='abc()'> 
    <option value='1'>1</option> 
.... 
... 
    <div id ='drop'></div>