<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>自定义select下拉框</title>
<link rel="stylesheet" href="css/index.css" />
</head>
<body>
<div class="mySelect">
<div class="mySelectInput">
<input class="inp" type="text" value="支持银行" readonly/>
<i></i>
</div>
<ul>
<li data-value="1">银行1</li>
<li data-value="2">银行2</li>
<li data-value="3">银行3</li>
</ul>
</div>
<div style="margin-top: 120px;"><a href="javascript:void(0)" οnclick="test()">提交</a></div>
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script>
$(function(){
$(".mySelect ul li").on("click",function(){
$(".inp").val($(this).html());
$(".inp").data("value",$(this).data("value"));
});
});
function test(){
alert($(".inp").data("value"));
}
</script>
</body>
</html>
