下拉列表功能获取数据添加到select表中

<!DOCTYPE html >
<html>

<head>
<meta charset="utf-8">
<title> Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
</style>
</head>
<body>
<select class="textPrepend" autofocus = "autofocus" _multiple = "multiple">
<option value ="">请选择</option>

</select>
<button class="textclas">提交</button>

<script src="jquery-1.7.2.min.js"></script>
<script>

$(function(){
/*数组添加到下拉列表中
* var _mozi=['墨家','墨子','墨翟','兼爱非攻','尚同尚贤'];
$.each(_mozi,function(key,val){
    //回调函数有两个参数,第一个是元素索引,第二个为当前值
    var num=key+1;
    $('.textPrepend').prepend('<option value ="'+key+'">'+val+'</option>');
})*/
/*json数组读取数据添加到select下拉列表中
* var people = { "programmers": [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },

{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },

{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]}
people = eval(people.programmers);
for(var i=0; i<people.length; i++)
{
$('.textPrepend').prepend('<option value ="'+[i]+'">'+people[i].firstName+'</option>');
}*/
/*遍历json对象添加到select下拉列表中
* var people= [ { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },

{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },

{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
]
$.each(people, function(idx, obj) {
    $('.textPrepend').prepend('<option value ="'+idx+'">'+obj.firstName+'</option>');
});*/
});

$('.textclas').on('click',function(){
alert('取到的数值是：'+$('.textPrepend').val());
});
</script>
</body>

</html>

下拉列表功能获取数据添加到select表中

猜你喜欢