html 下拉菜单自动填充,下拉框自动实现自动填充

在我们平台中有这样的一个功能，设置了数据字典就可以使下拉框自动选择数据的类型，但是有一点不足的地方就是没有默认值，现在我要做的就是如何实现这个有默认值的下拉框。

还是有日期来举例。如图所示功能：

(1)esayui-combobox方法：

在页面设置一个esayui-combobox控件，通过设置data-options="valueField: 'id', textField: 'text'来设置我们想要的数据和顺序，通过'selected':true来设置默认值。

data:[{ 'id':'0','text':'01','selected':true},

{ 'id':'1','text':'02'},

{ 'id':'2','text':'03'},

{ 'id':'3','text':'04'},

{ 'id':'4','text':'05'},

{ 'id':'5','text':'06'},

{ 'id':'6','text':'07'},

{ 'id':'7','text':'08'},

{ 'id':'8','text':'09'},

{ 'id':'9','text':'10'},

{ 'id':'10','text':'11'},

{ 'id':'11','text':'12'},]" />

(2)select option方法

esayui-combobox方法也有点缺陷，没有灵活能默认当月，只能在代码中写死一个月份。所有使用传统方法——select option方法去改造了下。

01

02

03

04

05

06

07

08

09

10

11

12

然后在用js设置一下默认值。

$(document).ready(function () {

var myDate = new Date();

var thisYear = myDate.getFullYear();

var backYear = (thisYear - 8);

var option = null;

thisYear = thisYear + 5;

for (l = backYear ; l < thisYear; l++) {

document.getElementById("YEAR").options.add(new Option(l, l));

}

//年份

document.getElementById("YEAR").value = (thisYear - 5);

//月份

var thisMonth = myDate.getMonth() + 1;

var m = thisMonth

m = m < 10 ? '0' + m : m;

//var m = thisMonth + "月";

// alert(thisMonth)

document.getElementById("MONTH").value = m;

});

这样就解决我们平台的下拉框默认值的问题。