<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<meta name="author" content="Beauty" />
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript" src="jquery.beautifySelect.js"></script>
<!-- Date: 2014-08-30 -->
</head>
<body>
<div style="margin:20px;">
<select id="sel1"></select>
<select id="sel2"></select>
<button onclick="redraw()">重绘</button>
</div>
<script type="text/javascript">
$(function(){
var _html = "";
for(var i = 0;i<22;++i){
_html += "<option>" +i+"闲来无事写插件"+"</option>";
}
document.getElementById("sel1").innerHTML = _html;
document.getElementById("sel2").innerHTML = _html;
$("#sel1").beautifySelect({
"maxShowItemNum" : 9,
"downIcon" : "url(down.png) right no-repeat",
"upIcon" : "url(up.png) right no-repeat"
});
$("#sel1").change(function(){
console.log(this.value+"改变");
});
});
function redraw(){
//如果select内容发生变化,相应重绘部分
var _html = "";
for(var i = 0 ;i<13;++i){
_html += "<option>" +i+"内容改变啦"+ "</option>";
}
document.getElementById("sel1").innerHTML = _html;
$("#sel1").beautifySelect({
"sDivStyle" : {
"border" : "1px solid red"
}
});
}
</script>
</body>
</html>
基于jquery的美化select插件
5星 · 超过95%的资源 需积分: 9 146 浏览量
2014-09-02
22:24:28
上传
评论
收藏 71KB 7Z 举报
AsuraIT
- 粉丝: 1
- 资源: 3
最新资源
- SQ2318ES-T1-GE3-VB一款SOT23封装N-Channel场效应MOS管
- swico-template-react
- SQ2315ES-T1-GE3-VB一款SOT23封装P-Channel场效应MOS管
- SQ2310ES-T1-GE3-VB一款SOT23封装N-Channel场效应MOS管
- DMC2600ML六轴双工位激光焊接示教系统操作说明书
- SQ2308BES-T1-E3-VB一款SOT23封装N-Channel场效应MOS管
- 总结操作系统及Linux的面试常见问题.zip
- SQ2303ES-T1-GE3-VB一款SOT23封装P-Channel场效应MOS管
- SQ2301ES-T1-GE3-VB一款SOT23封装P-Channel场效应MOS管
- Rust编程语言课程体系:从入门到精通+编程知识+技术研发
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈