<html>
<head>
<!-- Bootstrap CSS -->
<link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery -->
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<!-- Bootstrap JavaScript -->
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- layDate -->
<script src="layDate5\laydate\laydate.js"></script>
<style>
.sel,.in{
margin-top:50px;
margin-left:5px;
width:100px;
height:30px;
}
</style>
</head>
<body>
<!-- 下拉框 -->
<select class="sel">
<option value=2 selected='selected'>22</option>
</select>
<!-- 日期选择框 -->
<input type="text" class="in">
<!-- 查询按钮 -->
<button class="btn btn-primary quer">query</button>
</body>
</html>
<script>
//日期选择框赋初始值
$('.in').val('2019-12-10');
//layDate
laydate.render({
elem: '.in'
});
//定义下拉框要赋的初始值
var options = [
{name : '全部',value : '0'},
{name : '50ETF',value : '510050'},
{name : '300ETF',value : '510300'}
];
//下拉框初始化赋值 函数
var selectInit = function($ele,data){
var optio = '';
for(var i=0;i<data.length;i++){
if(data[i].name == '全部'){ //默认选中的值
optio = optio + '<option selected="selected" value='+ data[i].value +'>'+ data[i].name +'</option>';
}else{
optio = optio + '<option value='+ data[i].value +'>'+ data[i].name +'</option>';
}
}
$ele.html(optio);
}
//调用 下拉框初始化赋值 函数
selectInit($('.sel'),options);
//点击按钮
$('.quer').click(function(){
var selVal = $('.sel').val(); //获取下拉框选择的值
var inpVal = $('.in').val(); //日期选择框的值
alert(selVal + ' ' + inpVal);
});
</script>
js---html下拉框初始化
猜你喜欢
转载自blog.csdn.net/qq_39115469/article/details/103499324
今日推荐
周排行