一，效果图。

二，源代码。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic DataList - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/demo.css">
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic DataList</h2>
<p>The DataList can be created from the &lt;ul&gt; element.</p>
<div style="margin:20px 0;"></div>
<ul class="easyui-datalist" title="Basic DataList" lines="true" style="width:400px;height:250px">
<li value="AL">Alabama</li>
<li value="AK">Alaska</li>
<li value="AZ">Arizona</li>
<li value="AR">Arkansas</li>
<li value="CA">California</li>
<li value="CO">Colorado</li>
<li value="CT">Connecticut</li>
<li value="DE">Delaware</li>
<li value="FL">Florida</li>
<li value="GA">Georgia</li>
<li value="HI">Hawaii</li>
<li value="ID">Idaho</li>
<li value="IL">Illinois</li>
<li value="IN">Indiana</li>
<li value="IA">Iowa</li>
<li value="KS">Kansas</li>
<li value="KY">Kentucky</li>
<li value="LA">Louisiana</li>
<li value="ME">Maine</li>
<li value="MD">Maryland</li>
<li value="MA">Massachusetts</li>
<li value="MI">Michigan</li>
<li value="MN">Minnesota</li>
<li value="MS">Mississippi</li>
<li value="MO">Missouri</li>
<li value="MT">Montana</li>
<li value="NE">Nebraska</li>
<li value="NV">Nevada</li>
<li value="NH">New Hampshire</li>
<li value="NJ">New Jersey</li>
<li value="NM">New Mexico</li>
<li value="NY">New York</li>
<li value="NC">North Carolina</li>
<li value="ND">North Dakota</li>
<li value="OH">Ohio</li>
<li value="OK">Oklahoma</li>
<li value="OR">Oregon</li>
<li value="PA">Pennsylvania</li>
<li value="RI">Rhode Island</li>
<li value="SC">South Carolina</li>
<li value="SD">South Dakota</li>
<li value="TN">Tennessee</li>
<li value="TX">Texas</li>
<li value="UT">Utah</li>
<li value="VT">Vermont</li>
<li value="VA">Virginia</li>
<li value="WA">Washington</li>
<li value="WV">West Virginia</li>
<li value="WI">Wisconsin</li>
<li value="WY">Wyoming</li>
</ul>
</body>
</html>

Basic DataList的更多相关文章

  1. JavaScript进度条（datalist/repeater等多个进度条）

    JS代码: function SingleProgressBar() { var iload = document.getElementById("iLoading"); var ...

  2. 利用HTML5 的Datalist 元素实现输入提示

    HTML5有无限可能,总是在释出一些新鲜实用的功能,让原生的web环境更加炫酷. 今天看到datalist 这个元素,可以用来预先定义一个输入框的潜在选项,也就是我们在平时项目中经常用jQuery插件 ...

  3. Atitit HTTP 认证机制基本验证 (Basic Authentication) 和摘要验证 (Digest Authentication)attilax总结

    Atitit HTTP认证机制基本验证 (Basic Authentication) 和摘要验证 (Digest Authentication)attilax总结 1.1. 最广泛使用的是基本验证 ( ...

  4. Basic Tutorials of Redis(9) -First Edition RedisHelper

    After learning the basic opreation of Redis,we should take some time to summarize the usage. And I w ...

  5. Basic Tutorials of Redis(8) -Transaction

    Data play an important part in our project,how can we ensure correctness of the data and prevent the ...

  6. Basic Tutorials of Redis(7) -Publish and Subscribe

    This post is mainly about the publishment and subscription in Redis.I think you may subscribe some o ...

  7. Basic Tutorials of Redis(6) - List

    Redis's List is different from C#'s List,but similar with C#'s LinkedList.Sometimes I confuse with t ...

  8. Basic Tutorials of Redis(5) - Sorted Set

    The last post is mainly about the unsorted set,in this post I will show you the sorted set playing a ...

  9. Basic Tutorials of Redis(4) -Set

    This post will introduce you to some usages of Set in Redis.The Set is a unordered set,it means that ...

随机推荐

  1. MVC中关于JSON的处理

    jquery中提交数据     $.getJSON("/TopicUpdate/UpdateInformation", { "bookId": bookid } ...

  2. ie浏览器css中的行为expression详解

    CSS中的行为——expression (ie only) 最近对CSS中的行为比较感兴趣,虽然是不符合标准的也只有ie才能识别,但是他确实给css的功能扩展了不少.下面是摘自互联网上的文字和例子,因 ...

  3. elasticsearch集群部署

    启动elk: zjtest7-redis:/usr/local/elasticsearch-2.3.4/bin# ./elasticsearch -d 后台运行 访问: http://192.168. ...

  4. cocos2dx中的层CCLayer

    什么是层,层在cocos2dx里是一个能处理触摸事件的CCNode,因为它负责用户交互,因此大部分游戏细节都在这个类中完成,所以我们经常派生这个图层来完成逻辑交互代码.当然如果你的图层不需要接受交互信 ...

  5. 您应该了解的 Windows Azure 网站在线工具

     编辑人员注释:本文章由Windows Azure 网站团队的软件开发者 Amit Apple 撰写. 如果想要了解并亲身参与计算资源管理,那么您一定会很高兴得知这一消息:Windows Azur ...

  6. HDU 1787 GCD Again

    题目大意:求小于n的gcd(i,n)大于1的个数: 题解:欧拉函数直接求gcd(i,n)==1的个数  用n减即可 #include <cstdio> int eular(int n){ ...

  7. HDU 1091 A+B for Input-Output Practice (III)

    #include <cstdio> int main() { int a,b; while(scanf("%d%d",&a,&b)!=EOF) if ( ...

  8. Flex 事件机制

    使用ActionScript的单击事件示例 <?xml version="1.0" encoding="utf-8"?> <s:Applica ...

  9. hdu1711(终于搞懂了KMP算法了。。)

    题意:给你两个长度分别为n(1 <= N <= 1000000)和m(1 <= M <= 10000)的序列a[]和b[],求b[]序列在a[]序列中出现的首位置.如果没有请输 ...

  10. 【剑指offer】调整数组顺序

    转载请注明出处:http://blog.csdn.net/ns_code/article/details/25829395 剑指offer上的第14题,九度OJ为了确保输出的结果的唯一性,在输出上做了 ...