Question

我正在尝试动态创建下拉框，就像当我点击添加按钮时，它必须创建新的下拉框。下拉列表还包含动态值，就像它需要占用当前年份并且必须显示最多五年。请建议我这样做。

谢谢..

这是我尝试过的代码。

javascript代码：

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>

Javascript代码

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

只要您点击添加下拉按钮，它就会创建一个连续五年选项的选择元素。

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>

如何在jsp中使用javascript动态创建下拉框？

2 个答案: