combo--2

youyang_java

浏览: 316258 次
性别:
来自: 重庆

最近访客更多访客>>

morelily

txlong_onz

LonelyMJ

tianxizhong

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

jquery-easyui-1.2.6

<!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">

    
    <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>

查看图片附件

分享到：

combobox--1 | combo--1

2014-06-16 10:02
浏览 678
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

combo--2

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

combo--2

评论

发表评论

相关推荐

propertygrid--1

combogrid--1

combotree--2

combotree--1

combobox--5

combobox--4

combobox--3

combobox--2

combobox--1

combo--1

datagrid--5 一些小的功能

datagrid--4 行编辑模式

datagrid --3

datagrid --2

datagrid --1

layout

form表单以及validateBox校验

ajax提交表单

panel

easyloader的使用

最近访客更多访客>>