JS实现项目查找功能
又是好久没有更新文章了，技术差，人又懒是重罪啊！！
在工作中每天都要查找目前正在接手的项目，而如果项目一多起来怎么办呢？ 最近主管突然说要找一下以前的项目改一点BUG，然后我就找了半天才找到对应的文件夹。这就严重影响了工作时间。故此，花了一点时间做了一下公司的项目查找功能，方便以后项目的查找，减少在这个上面的时间。
需求如下：
1、项目查找分为URL地址及文件夹路径
2、输入相应的项目名称(拼音),回车即可打开对应的项目URL或显示文件夹路径
3、显示以往项目列表，点击即可查看相应数据
效果实现：
一、页面结构及样式( html结构及样式就不多做解释)
<!DOCTYPE html>
<html lang="ZH-CN">
<head>
<meta charset="UTF-8">
<title>公司项目查找</title>
<style>
body {text-align:center;padding:100px 0;font-family:"Microsoft YaHei";background:#f5f5f5;text-shadow:0 1px 0 #fff;}
ul, ol {margin:0;padding:0;list-style:none;}
h1,h2 {font-weight:normal;color:#333;}
h1 {margin-bottom:40px;}
input {font-size:16px;font-family:"Microsoft YaHei";outline:none;}
input[type="text"] {width:360px;height:38px;padding:0 10px;margin-right:20px;border:1px solid #ccc;}
input[type="text"]:focus {box-shadow:0 1px 4px rgba(0,0,0,.2);}
input[type="button"] {height:42px;line-height:38px;width:100px;cursor:pointer;background:#fff;border:1px solid #ccc;}
input[type="button"]:hover {background:#eee;}
.search {width:510px;margin:0 auto 40px;text-align:left;}
.search p {font-size:14px;color:#333;margin:8px 0;}
.search_type li {display:inline-block;*display:block;*zoom:1;margin-right:15px;cursor:pointer;line-height:40px;color:#999;}
.search_type li.on {color:#333;}
.search_list {width:1024px;margin:0 auto;padding-bottom:1px;overflow:hidden;}
.search_list li {float:left;width:200px;line-height:50px;cursor:pointer;border:1px solid #ccc;margin:0 -1px -1px 0;background:#fff;}
.search_list li:hover {background:#eee;}
/*弹出框*/
.box {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);}
.box_txt {display:none;position:fixed;top:50%;left:50%;background:#fff;font-size:20px;padding:20px 60px;transform:translate(-50%,-50%);border-radius:5px;box-shadow:0 1px 10px rgba(0,0,0,.6);}
</style>
</head>
<body> <h1>公司项目查找</h1>
<div class="search">
<!-- 选择类型 -->
<ul id="searchType" class="search_type">
<li data-type="url" class="on">访问地址</li>
<li data-type="file">文件夹路径</li>
</ul>
<input type="text" name="url" id="url" placeholder="请输入对应项目名称" />
<input type="button" id="urlBtn" value="打 开" />
<p>示例：六色网站项目，请输入"liuse"，回车即可！</p>
</div>
<!-- 项目列表 -->
<h2>项目列表</h2>
<ul id="searchList" class="search_list"></ul> <!-- 弹出框 -->
<div id="box" class="box"></div>
<div id="boxTxt" class="box_txt">E:\MoRong\AMP\htdoc\vhost6\yang</div> </body>
</html>
二、脚本功能实现
1）定义项目存储数据数组， 分别代表： name: 搜索名称 ， desc: 项目中文描述 ， file: 项目文件夹路径 ， url: 项目URL地址
// url 地址
var dataUrl = [
{
"name": "yang-mobile",
"desc": "羊羊得意-手机访问",
"file": "E:\\MoRong\\AMP\\htdoc\\chenzong\\yang",
"url": "192.168.1.185/yang"
},
{
"name": "yang",
"desc": "羊羊得意",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost6\\yang",
"url": "127.0.0.6/yang"
},
{
"name": "lottery",
"desc": "阿里感谢有你",
"file": "E:\\MoRong\\AMP\\htdoc\\chenzong\\lottery",
"url": "192.168.1.185/lottery"
},
{
"name": "jiate",
"desc": "嘉特通信",
"file": "E:\\MoRong\\AMP\\htdoc\\jiate",
"url": "jiate.com"
},
{
"name": "jinpai",
"desc": "金派电子",
"file": "E:\\MoRong\\AMP\\htdoc\\jinpai",
"url": "jinpai.com"
},
{
"name": "laili",
"desc": "莱立服装",
"file": "E:\\MoRong\\AMP\\htdoc\\laili",
"url": "www.laili.com"
},
{
"name": "liuse",
"desc": "六色软件",
"file": "E:\\MoRong\\AMP\\htdoc\\liuse",
"url": "liuse.com"
},
{
"name": "paizhao",
"desc": "公司摄影",
"file": "E:\\MoRong\\AMP\\htdoc\\paizhao",
"url": "www.paizhao.com"
},
{
"name": "saima",
"desc": "阿里巴巴赛马会",
"file": "E:\\MoRong\\AMP\\htdoc\\paizhao/saima",
"url": "www.paizhao.com/saima"
},
{
"name": "morong",
"desc": "默容官网",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost3\\morong",
"url": "127.0.0.3/morong"
},
{
"name": "wohao",
"desc": "沃豪科技",
"file": "E:\\MoRong\\AMP\\htdoc\\wohao",
"url": "www.wohao.com"
}
];
2） 创建公用function，获取ID及返回事件目标功能
// 公用功能
var morong = function() {
return {
// 获取ID
$$: function(id) {
return (!id) ? null : document.getElementById(id);
},
// 返回事件目标
eventFun: function(event) {
var e = event || window.event;
return e.target || e.srcElement;
}
}
}();
3）创建项目查找功能构造函数，存储项目需要使用功能变量
// 打开URL构造函数
function ProjectSearch(obj) {
this.url = morong.$$(obj.url); // 接收URL文本框
this.btn = morong.$$(obj.btn); // 打开按钮
this.list = morong.$$(obj.list); // 项目列表
this._type = morong.$$(obj._type); // 搜索类型
this.box = morong.$$(obj.box); // 弹出框
this.boxTxt = morong.$$(obj.boxTxt);// 弹出内容
this.dataUrl = obj.dataUrl; // 项目数据
this.len = this.dataUrl.length; // 项目数量
this.selType = "url"; // 选择类型
}
4）创建原型方法
ProjectSearch.prototype = {
constructor: ProjectSearch
};
5）实例化构造函数，并传入相应参数，调用init()方法初始化页面功能
// 实例化
var project = new ProjectSearch({
url: "url",
btn: "urlBtn",
list: "searchList",
_type: "searchType",
box: "box",
boxTxt: "boxTxt",
dataUrl: dataUrl
});
// 初始化页面功能
project.init();
6）获取项目列表， 获取项目长度，遍历并且获取相应内容插入到页面ul#searchList标签中
// 获取项目列表
getListDesc: function() {
var strHTML = "", i;
// 遍历项目
for (i = 0; i < this.len; i++) {
var d = this.dataUrl[i];
strHTML += "<li data-name='"+d.name+"' title="+d.name+">"+d.desc+"</li>";
}
// 插入数据
this.list.innerHTML = strHTML;
}
7）获取查找项目名称，如果是点击列表则获取列表name 值，如果为文本框输入，则获取文本框内容，并判断搜索的是什么类型，最后搜索类型的不同，执行对应操作。
// 获取URL并打开
getUrlContent: function(name) {
var val = name || this.url.value,
flag = false,
url;
// 如果是点击项目列表
if (!name) {
if (val == '') {
alert("内容不能为空！");
return false;
}
}
// 判断类型
if (this.selType == "url") {
// 遍历查找内容
for (var i = 0; i < this.len; i++) {
if (this.dataUrl[i].name == val) {
url = "http://"+this.dataUrl[i].url;
break;
}
}
} else if (this.selType == "file") {
// 遍历查找内容
for (var i = 0; i < this.len; i++) {
if (this.dataUrl[i].name == val) {
url = this.dataUrl[i].file;
flag = true;
break;
}
}
}
// 如果没有找到
if (!url) {
alert("没有找到此项目，请重新输入！");
return false;
}
// 判断打开url或显示文件路径
(!flag) ? window.open(url) : this.promptBox(url);
}
8）设置类型及文件路径弹出框，设置类型：根据点击的目标，设置当前点击样式，并设置搜索类型为URL 或者 文件路径。 文件路径弹出框：插入文本内容，并显示
// 设置类型
classTag: function(target) {
var list = this._type.getElementsByTagName("li"), // 搜索类型列表
len = list.length;
for (var i = 0; i < len; i++) {
list[i].className = ""; // 移除所有class
}
target.className = "on"; // 添加给当前点击元素
this.selType = target.getAttribute("data-type"); // 设置类型
},
// 提示框
promptBox: function(file) {
this.boxTxt.innerHTML = file; // 插入数据
this.box.style.display = "block"; // 显示
this.boxTxt.style.display = "block";
}
9）设置初始化功能， 分别绑定“打开”按钮点击搜索事件及回车搜索事件功能，项目列表和类型选择同样采用绑定事件委托，并获取相应内容类型进行搜索，弹出框点击隐藏
// 初始化
init: function() {
var _self = this;
_self.url.focus(); // 默认聚焦
_self.getListDesc(); // 展示项目列表
// 按钮监听
_self.btn.addEventListener("click", function() {
_self.getUrlContent(false);
}, false);
// 键盘回车键监听
document.addEventListener("keypress", function() {
if (event.keyCode == 13) {
_self.getUrlContent(false);
}
}, false);
// 绑定点击项目列表 - 事件委托
_self.list.addEventListener("click", function(event) {
var target = morong.eventFun(event);
if (target.nodeName.toLowerCase() == "li") {
//获取自定义属性内容并打开页面
_self.getUrlContent(target.getAttribute("data-name"));
}
}, false);
// 类型选择事件
_self._type.addEventListener("click", function(event) {
var target = morong.eventFun(event);
if (target.nodeName.toLowerCase() == "li") {
_self.classTag(target);
}
}, false);
// 点击弹出框背景隐藏弹出框
_self.box.addEventListener("click", function() {
if (this.style.display == "block") {
this.style.display = "none";
_self.boxTxt.style.display = "none";
}
}, false);
}
10）整个项目查找功能分为以上几个小部分组成，全部代码示例如下：
<!DOCTYPE html>
<html lang="ZH-CN">
<head>
<meta charset="UTF-8">
<title>公司项目查找</title>
<style>
body {text-align:center;padding:100px 0;font-family:"Microsoft YaHei";background:#f5f5f5;text-shadow:0 1px 0 #fff;}
ul, ol {margin:0;padding:0;list-style:none;}
h1,h2 {font-weight:normal;color:#333;}
h1 {margin-bottom:40px;}
input {font-size:16px;font-family:"Microsoft YaHei";outline:none;}
input[type="text"] {width:360px;height:38px;padding:0 10px;margin-right:20px;border:1px solid #ccc;}
input[type="text"]:focus {box-shadow:0 1px 4px rgba(0,0,0,.2);}
input[type="button"] {height:42px;line-height:38px;width:100px;cursor:pointer;background:#fff;border:1px solid #ccc;}
input[type="button"]:hover {background:#eee;}
.search {width:510px;margin:0 auto 40px;text-align:left;}
.search p {font-size:14px;color:#333;margin:8px 0;}
.search_type li {display:inline-block;*display:block;*zoom:1;margin-right:15px;cursor:pointer;line-height:40px;color:#999;}
.search_type li.on {color:#333;}
.search_list {width:1024px;margin:0 auto;padding-bottom:1px;overflow:hidden;}
.search_list li {float:left;width:200px;line-height:50px;cursor:pointer;border:1px solid #ccc;margin:0 -1px -1px 0;background:#fff;}
.search_list li:hover {background:#eee;}
/*弹出框*/
.box {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);}
.box_txt {display:none;position:fixed;top:50%;left:50%;background:#fff;font-size:20px;padding:20px 60px;transform:translate(-50%,-50%);border-radius:5px;box-shadow:0 1px 10px rgba(0,0,0,.6);}
</style>
</head>
<body> <h1>公司项目查找</h1>
<div class="search">
<!-- 选择类型 -->
<ul id="searchType" class="search_type">
<li data-type="url" class="on">访问地址</li>
<li data-type="file">文件夹路径</li>
</ul>
<input type="text" name="url" id="url" placeholder="请输入对应项目名称" />
<input type="button" id="urlBtn" value="打 开" />
<p>示例：六色网站项目，请输入"liuse"，回车即可！</p>
</div>
<!-- 项目列表 -->
<h2>项目列表</h2>
<ul id="searchList" class="search_list"></ul> <!-- 弹出框 -->
<div id="box" class="box"></div>
<div id="boxTxt" class="box_txt">E:\MoRong\AMP\htdoc\vhost6\yang</div> <script>
(function() { // url 地址
var dataUrl = [
{
"name": "yang-mobile",
"desc": "羊羊得意-手机访问",
"file": "E:\\MoRong\\AMP\\htdoc\\chenzong\\yang",
"url": "192.168.1.185/yang"
},
{
"name": "yang",
"desc": "羊羊得意",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost6\\yang",
"url": "127.0.0.6/yang"
},
{
"name": "lottery",
"desc": "阿里感谢有你",
"file": "E:\\MoRong\\AMP\\htdoc\\chenzong\\lottery",
"url": "192.168.1.185/lottery"
},
{
"name": "jiate",
"desc": "嘉特通信",
"file": "E:\\MoRong\\AMP\\htdoc\\jiate",
"url": "jiate.com"
},
{
"name": "jinpai",
"desc": "金派电子",
"file": "E:\\MoRong\\AMP\\htdoc\\jinpai",
"url": "jinpai.com"
},
{
"name": "laili",
"desc": "莱立服装",
"file": "E:\\MoRong\\AMP\\htdoc\\laili",
"url": "www.laili.com"
},
{
"name": "liuse",
"desc": "六色软件",
"file": "E:\\MoRong\\AMP\\htdoc\\liuse",
"url": "liuse.com"
},
{
"name": "paizhao",
"desc": "公司摄影",
"file": "E:\\MoRong\\AMP\\htdoc\\paizhao",
"url": "www.paizhao.com"
},
{
"name": "saima",
"desc": "阿里巴巴赛马会",
"file": "E:\\MoRong\\AMP\\htdoc\\paizhao/saima",
"url": "www.paizhao.com/saima"
},
{
"name": "morong",
"desc": "默容官网",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost3\\morong",
"url": "127.0.0.3/morong"
},
{
"name": "wohao",
"desc": "沃豪科技",
"file": "E:\\MoRong\\AMP\\htdoc\\wohao",
"url": "www.wohao.com"
},
{
"name": "chenzong",
"desc": "陈总网站",
"file": "E:\\MoRong\\AMP\\htdoc\\chenzong",
"url": "chenzong.com"
},
{
"name": "angular",
"desc": "angular练习",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost3\\angular",
"url": "127.0.0.3/angular"
},
{
"name": "gulp",
"desc": "gulp练习",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost3\\gulp",
"url": "127.0.0.3/gulp"
},
{
"name": "1",
"desc": "127.0.0.1",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost1",
"url": "127.0.0.1"
},
{
"name": "2",
"desc": "127.0.0.2",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost2",
"url": "127.0.0.2"
},
{
"name": "3",
"desc": "127.0.0.3",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost3",
"url": "127.0.0.3"
},
{
"name": "4",
"desc": "127.0.0.4",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost4",
"url": "127.0.0.4"
},
{
"name": "5",
"desc": "127.0.0.5",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost5",
"url": "127.0.0.5"
},
{
"name": "6",
"desc": "127.0.0.6",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost6",
"url": "127.0.0.6"
},
{
"name": "7",
"desc": "127.0.0.7",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost7",
"url": "127.0.0.7"
},
{
"name": "8",
"desc": "127.0.0.8",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost8",
"url": "127.0.0.8"
},
{
"name": "9",
"desc": "127.0.0.9",
"file": "E:\\MoRong\\AMP\\htdoc\\vhost9",
"url": "127.0.0.9"
}
]; // 公用功能
var morong = function() {
return {
// 获取ID
$$: function(id) {
return (!id) ? null : document.getElementById(id);
},
// 返回事件目标
eventFun: function(event) {
var e = event || window.event;
return e.target || e.srcElement;
}
}
}(); // 打开URL构造函数
function ProjectSearch(obj) {
this.url = morong.$$(obj.url); // 接收URL文本框
this.btn = morong.$$(obj.btn); // 打开按钮
this.list = morong.$$(obj.list); // 项目列表
this._type = morong.$$(obj._type); // 搜索类型
this.box = morong.$$(obj.box); // 弹出框
this.boxTxt = morong.$$(obj.boxTxt);// 弹出内容
this.dataUrl = obj.dataUrl; // 项目数据
this.len = this.dataUrl.length; // 项目数量
this.selType = "url"; // 选择类型
}
// 原型方法
ProjectSearch.prototype = {
constructor: ProjectSearch,
// 获取项目列表
getListDesc: function() {
var strHTML = "", i;
// 遍历项目
for (i = 0; i < this.len; i++) {
var d = this.dataUrl[i];
strHTML += "<li data-name='"+d.name+"' title="+d.name+">"+d.desc+"</li>";
}
// 插入数据
this.list.innerHTML = strHTML;
},
// 获取URL并打开
getUrlContent: function(name) {
var val = name || this.url.value,
flag = false,
url;
// 如果是点击项目列表
if (!name) {
if (val == '') {
alert("内容不能为空！");
return false;
}
}
// 判断类型
if (this.selType == "url") {
// 遍历查找内容
for (var i = 0; i < this.len; i++) {
if (this.dataUrl[i].name == val) {
url = "http://"+this.dataUrl[i].url;
break;
}
}
} else if (this.selType == "file") {
// 遍历查找内容
for (var i = 0; i < this.len; i++) {
if (this.dataUrl[i].name == val) {
url = this.dataUrl[i].file;
flag = true;
break;
}
}
}
// 如果没有找到
if (!url) {
alert("没有找到此项目，请重新输入！");
return false;
}
// 判断打开url或显示文件路径
(!flag) ? window.open(url) : this.promptBox(url);
},
classTag: function(target) {
var list = this._type.getElementsByTagName("li"), // 搜索类型列表
len = list.length;
for (var i = 0; i < len; i++) {
list[i].className = ""; // 移除所有class
}
target.className = "on"; // 添加给当前点击元素
this.selType = target.getAttribute("data-type"); // 设置类型
},
// 提示框
promptBox: function(file) {
this.boxTxt.innerHTML = file; // 插入数据
this.box.style.display = "block"; // 显示
this.boxTxt.style.display = "block";
},
// 初始化
init: function() {
var _self = this;
_self.url.focus(); // 默认聚焦
_self.getListDesc(); // 展示项目列表
// 按钮监听
_self.btn.addEventListener("click", function() {
_self.getUrlContent(false);
}, false);
// 键盘回车键监听
document.addEventListener("keypress", function() {
if (event.keyCode == 13) {
_self.getUrlContent(false);
}
}, false);
// 绑定点击项目列表 - 事件委托
_self.list.addEventListener("click", function(event) {
var target = morong.eventFun(event);
if (target.nodeName.toLowerCase() == "li") {
//获取自定义属性内容并打开页面
_self.getUrlContent(target.getAttribute("data-name"));
}
}, false);
// 类型选择事件
_self._type.addEventListener("click", function(event) {
var target = morong.eventFun(event);
if (target.nodeName.toLowerCase() == "li") {
_self.classTag(target);
}
}, false);
// 点击弹出框背景隐藏弹出框
_self.box.addEventListener("click", function() {
if (this.style.display == "block") {
this.style.display = "none";
_self.boxTxt.style.display = "none";
}
}, false);
}
};
// 实例化
var project = new ProjectSearch({
url: "url",
btn: "urlBtn",
list: "searchList",
_type: "searchType",
box: "box",
boxTxt: "boxTxt",
dataUrl: dataUrl
});
project.init();
})();
</script>
</body>
</html>
总结： 工作中总会需要查找以往的许多项目，或可以加入浏览器书签，或可直接把新增的项目数据存入数组中，都是为了提高工作效率，减少不必要的时间浪费。本功能只是个人的javascript练习，因为新手，代码组织不是很好，望大神指点优化，共勉之！
JS实现项目查找功能的更多相关文章
- 百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例
百度地图 api 功能封装类 (ZMap.js) 本地搜索,范围查找实例 相关说明 1. 界面查看: 吐槽贴:百度地图 api 封装 的实用功能 [源码下载] 2. 功能说明: 百度地图整合功能分享修 ...
- 好强大的页面功能调试（js调试，查找js绑定的事件）值得学习
引自:http://www.poluoluo.com/jzxy/201209/178110_2.html 这篇文章是根据目前 chrome 稳定版(19.0.1084.52 m)写的,因为 googl ...
- 8 步搭建 Node.js + MongoDB 项目的自动化持续集成
任何事情超过 90 秒就应该自动化,这是程序员的终极打开方式.Automating shapes smarter future. 这篇文章中,我们通过创建一个 Node.js + MongoDB 项目 ...
- ASP.NET MVC 4 RC的JS/CSS打包压缩功能 (转载)
ASP.NET MVC 4 RC的JS/CSS打包压缩功能 打包(Bundling)及压缩(Minification)指的是将多个js文件或css文件打包成单一文件并压缩的做法,如此可减少浏览器需下载 ...
- Js元素拖拽功能实现
Js元素拖拽功能实现 需要解决的问题 最近项目遇到了一个问题,就是用户某个操作需要弹出一个自定义的内容输入框,但是有个缺点,当浏览太大的时候没办法点击确认和取消按钮,应为这个弹出框是采用绝对定位的,取 ...
- Qt 查找功能
版权声明 该文章原创于Qter开源社区(www.qter.org),作者yafeilinux,转载请注明出处! 导语 这一篇我们来加上查找菜单的功能.因为要涉及Qt Creator的很多实用功 ...
- source insight的查找功能
source insight是一款非常好的c语言的程序编辑器.方便对project管理,方便程序的阅读和编辑. 查找功能使用十分频繁.选项较多,与其他软件的查找功能也类似,以下对英文版的查找功能,做简 ...
- 个人永久性免费-Excel催化剂功能第80波-按条件查找数字，扩展原生查找功能
Excel的查找替换功能,只能对文本类数据查找较为得力,若需查找数字类型的数据,如查找大于100的数字,就无能为力,此篇Excel催化剂补足其短板. Excel数据类型知识背景介绍 用好Excel,必 ...
- 字节跳动Web Infra发起 Modern.js 开源项目，打造现代 Web 工程体系
10 月 27 日举办的稀土开发者大会上,字节跳动 Web Infra 正式发起 Modern.js 开源项目,希望推动现代 Web 开发范式的普及,发展完整的现代 Web 工程体系,突破应用开发效率 ...
随机推荐
- Ubuntu 安装Android Studio与使用手册
用的是Ubuntu 12.04 1.先去下载,国内可以去这里下载 https://github.com/inferjay/AndroidDevTools 2.下载后解压进入android-studio ...
- WINCE6.0去掉桌面快捷方式
WINCE6.0去掉桌面快捷方式,主要是修改xxx.bat文件,比如我要去掉My Documents和Media Player的快捷方式. (1) 去掉My Documents桌面快捷方式 找到 ...
- Area of a Circle
Area of a Circle Description: Complete the function circleArea so that it will return the area of a ...
- Angularjs checkbox的ng属性
angularjs 默认给 input[checkbox] 元素定制了一些属性,如: <input type="checkbox" ng-mudel="name&q ...
- 解决windows下vim方向键变成 ABCD 的问题
一.问题描述: windows下面要安装git --> 安装了 msys2 -->安装并更新了 vim(7.4),然后在使用过程中发现vim不能使用 BACKSPACE 键,按方向键会打 ...
- hdu 3549 Flow Problem(增广路算法)
题目:http://acm.hdu.edu.cn/showproblem.php?pid=3549 模板题,白书上的代码... #include <iostream> #include & ...
- jquery 分页控件(二)
上一章主要是关于分页控件的原理,代码也没有重构.在这一章会附上小插件的下载链接,插件主要就是重构逻辑部分,具体可以下载源文件看下,源代码也有注释.为了测试这个插件是能用的,我弄了个简单的asp.net ...
- Js计算-当月每周有多少天
查看Demo: 源代码如下: <script> //计算当月总天数 function getCountDays() { var curDate = new Date(); /* 获取当前月 ...
- HTML.ActionLink 和 Url.Action 的区别
html.ActionLink生成一个<a href=".."></a>标记.而Url.Action只返回一个url.例如:@Html.ActionLink ...
- 新手学习数据库（一）用Powerdesigner设计数据库
说明: 一.学会用开发语言进行数据库编程,其关键是在于学会sql语言,开发语言只不过给程序员提供了一个操作数据库的接口罢了. 二. 本人也是初学者,采用的数据库设计软件是powerdesigner.利 ...