combo--2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>1.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- easyui的样式 -->
<link rel="stylesheet" type="text/css" href="../jslib/jquery-easyui-1.3.1/themes/default/easyui.css">
<!-- 小图标的样式 -->
<link rel="stylesheet" type="text/css" href="../jslib/jquery-easyui-1.3.1/themes/icon.css">
<script type="text/javascript" src="../jslib/jquery-easyui-1.3.1/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../jslib/jquery-easyui-1.3.1/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../jslib/jquery-easyui-1.3.1/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
$(function(){
$('#cc').combo({
width:170,
required:true,
editable:false,
panelWidth:170,
panelHeight:300,
value : '1',
onChange: function(newValue, oldValue){
alert("newValue="+newValue+",oldValue="+oldValue);
},
validType:'email'
});
//让输入框获取焦点
$('#cc').combo('textbox').focus();
$('#sp').appendTo($('#cc').combo('panel'));
$('#sp img').click(function(){
var v = $(this).attr("v");
var s = $(this).attr("t");
$('#cc').combo('setValue', v).combo('setText', s).combo('hidePanel');
});
});
var showPal = function(){
$('#cc').combo('showPanel');
}
</script>
</head>
<body>
<select id="cc" style="width:150px"></select>
<div id="sp">
<div style="color:#99BBE8;background:#fafafa;padding:5px;">请选择一个图片</div>
<div style="padding:10px">
<img src="../style/images/dogs/puppy_dogs_01.png" v="1" t="1图片"><br/>
<img src="../style/images/dogs/puppy_dogs_02.png" v="2" t="2图片"><br/>
<img src="../style/images/dogs/puppy_dogs_03.png" v="3" t="3图片"><br/>
<img src="../style/images/dogs/puppy_dogs_04.png" v="4" t="4图片"><br/>
<img src="../style/images/dogs/puppy_dogs_05.png" v="5" t="5图片"><br/>
<img src="../style/images/dogs/puppy_dogs_06.png" v="6" t="6图片"><br/>
<img src="../style/images/dogs/puppy_dogs_07.png" v="7" t="7图片"><br/>
</div>
</div>
<button onclick="showPal();">显示下拉列表</button>
<button onclick="$('#cc').combo('clear');">清空下拉列表</button>
</body>
</html>