自定义样式的select下拉框深入探索
第一个版本：
首先实现自定义select下拉框应该具有的功能，我是选择将原来的select隐藏掉，自己在jquery代码中动态写进去<dl><dd><dt>这样的结构来模拟真正的select的操作。
用来模拟select框的div结构如下：
<div class="selectbox">//包裹整个模拟框的盒子
<div class="currentselected"></div>//用于当前默认显示的selected的元素
<div class="selectoption"></div>//模拟弹出的select下拉框<dl><dd><dt>结构包裹在其中
</div>
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery.min.js"></script> <style>
p{float:left;margin:20px;font-size:14px} .i_selectbox {
margin-top:20px;
height:32px;
position:relative;
font-size:14px
}
/* 默认显示的select框*/
.i_selectbox .i_currentselected {
width:150px;
height:24px;
background:url(select.png) 176px 4px no-repeat;
border:1px solid #cdcdcd;
text-indent:10px;
line-height:24px;
cursor:pointer
}
/* 下拉选择框 */
.i_selectbox .i_selectoption {
overflow-x:hidden;
overflow-y:hidden;
position:absolute;
left:0px;
top:17px;
padding:5px;
background-color:#fff;
background:rgba(255,255,255,.9);
border:1px solid #eee
}
.i_selectbox .i_selectoption dt {
height:24px;
background-color:#eee;
text-indent:5px;
font-style:italic;
color:#555;
line-height:24px;
}
.i_selectbox .i_selectoption dd{
margin-left: -3px;
height:30px;
border-bottom:1px solid #cdcdcd;
cursor:pointer;
text-indent:2px;
line-height:30px
}
.i_selectbox .i_selectoption dd:hover{
background-color:#cdcdcd;
color:#fff
}
.i_selectbox .i_selectoption dd.selected{
background-color:#f17f36;
color:#fff
}
</style>
<head>
<body>
<select class="my_select"> <option value="0">Alabama</option>
<option value="1">Alaska</option>
<option value="2">Arizona</option> <option value="3">Arkansas</option>
<option value="4">California</option>
<option value="5">Colorado</option> <option value="6">Connecticut</option>
<option value="7">Delaware</option>
<option value="8">Columbia</option>
<option value="9">Florida</option> </select>
<script> /*插件写法的函数*/
$.fn.newStyle = function(){
var set = {
selectbox : 'i_selectbox',
showselect : 'i_currentselected',
selectoption : 'i_selectoption',
curselect : 'selected',
width : 200,
height :150,
zindex : 2
};
/*让最初的select隐藏*/
$(this).hide();
/*动态写进去html替代原本的select*/
var html = '<div class="'+set.selectbox+'" style="zindex:'+set.zindex+'">'
+'<div class="'+set.showselect+'" style="width:'+set.width+'px;">'+$(this).find('option:selected').text()+'</div>'
+'<dl class="'+set.selectoption+'" style="display:none;width:'+set.width+'px" >';
if($(this).find('optgroup').size()>0){
$(this).find('optgroup').each(function(){
html += '<dt>'+$(this).attr('label')+'</dt>';
$(this).find('option').each(function(){
if($(this).is(':selected')){
html += '<dd class="'+set.curselect+'">'+$(this).text()+'</dd>';
}else{
html += '<dd>'+$(this).text()+'</dd>';
}
});
});
}else{
$(this).find('option').each(function(){
if($(this).is(':selected')){
html += '<dd class="'+set.curselect+'">'+$(this).text()+'</dd>';
}else{
html += '<dd>'+$(this).text()+'</dd>';
}
}); }
/*将html插入到select框的后面*/
$('select').after(html);
console.log(0);
/*添加事件*/ /*默认显示框的选择事件toggle选择*/
$('.'+set.showselect).toggle(function(){
console.log(1);
/*$('.selectoption').hide();*/
$('.'+set.selectbox).css('zindex',set.zindex);
$('.'+set.selectoption).css('zindex',set.zindex+1);
$('.'+set.selectoption).toggle();
},function(){
$('.'+set.selectoption).css('zindex',set.zindex);
$('.'+set.selectoption).toggle();
});
/*下拉列表的选择事件*/
$('.'+set.selectoption).find('dd').click(function(){
console.log(2);
$(this).addClass(set.curselect).siblings().removeClass(set.curselect);
var index = $('.'+set.selectoption).find('dd').index(this);
$('.'+set.showselect).text($(this).text());
$(this).find('option').eq(index).attr('selected','selected');
$('.'+set.selectoption).hide();
});
/*点击select框之外的其他部分的时候select框应该收起*/
$('html,body').click(function(e){
/* 判断当前的点击事件目标不是set.selectoption这个class*/
if(e.target.className.indexOf(set.selectoption)==-1){
$('.'+set.selectoption).hide();
$('.'+set.selectbox).css('zIndex',set.zindex);
}
}); } $('.my_select').newStyle(); </script>
</body>
</html>
TIPs：1.给默认显示的下拉框添加toggle事件而不是一般的click事件使得它的连续点击具有意义；
2.给html，body添加事件，判断在点击自定义的下拉框之外的任何地方的时候，自定义下拉框收起。
本来我也以为，一段代码一个功能这样写完就可以了，但是继续改进下去，可以学到的东西真的很多。
第二个版本：
这里是给我自定义的select下拉框添加了键盘选择事件的版本，上下键选择，同时实时更新默认显示框中的内容，esc键实现自定义下拉框收起，此时上下键依然可以实时选择。
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery.min.js"></script> <style> /* 这里来定义你自己的select框的样式 */
.i_selectbox {
margin-top:20px;
height:32px;
position:relative;
font-size:14px
}
/* 默认显示的select框*/
.i_selectbox .i_currentselected {
width:150px;
height:24px;
background:url(select.png) 176px 4px no-repeat;
border:1px solid #cdcdcd;
text-indent:10px;
line-height:24px;
cursor:pointer
}
/* 这里是隐藏的input框 */
#hiddenput {
display: block;
width:200px;
height:18px;
margin-top: -25px;
position: absolute;
z-index:-2;
opacity:0;
filter:alpha(opacity=0);
}
/* 下拉选择框 */
.i_selectbox .i_selectoption {
overflow-x:hidden;
overflow-y:hidden;
position:absolute;
left:0px;
top:17px;
padding:5px;
background-color:#fff;
background:rgba(255,255,255,.9);
border:1px solid #eee
}
.i_selectbox .i_selectoption dt {
height:24px;
background-color:#eee;
text-indent:5px;
font-style:italic;
color:#555;
line-height:24px;
}
.i_selectbox .i_selectoption dd{
margin-left: -3px;
height:30px;
border-bottom:1px solid #cdcdcd;
cursor:pointer;
text-indent:2px;
line-height:30px
}
.i_selectbox .i_selectoption dd:hover{
background-color:#cdcdcd;
color:#fff
}
.i_selectbox .i_selectoption dd.selected{
background-color:#f17f36;
color:#fff
}
</style>
<head>
<body>
<select class="my_select"> <option value="0">Alabama</option>
<option value="1">Alaska</option>
<option value="2">Arizona</option> <option value="3">Arkansas</option>
<option value="4">California</option>
<option value="5">Colorado</option> <option value="6">Connecticut</option>
<option value="7">Delaware</option>
<option value="8">Columbia</option>
<option value="9">Florida</option> </select>
<script>
(function($){
/*插件写法的函数*/
$.fn.newStyle = function(){
var set = {
selectbox : 'i_selectbox',
showselect : 'i_currentselected',
selectoption : 'i_selectoption',
curselect : 'selected',
width : 200,
height :150,
zindex : 2
};
/*让最初的select隐藏*/
$(this).hide();
/*动态写进去html替代原本的select*/
var html = '<div class="'+set.selectbox+'" style="zindex:'+set.zindex+'">'
+'<div class="'+set.showselect+'" style="width:'+set.width+'px;">'+$(this).find('option:selected').text()+'</div>'
+'<input type="text" id="hiddenput" name="hiddenput"/>'
+'<dl class="'+set.selectoption+'" style="display:none;width:'+set.width+'px" >';
if($(this).find('optgroup').size()>0){
$(this).find('optgroup').each(function(){
html += '<dt>'+$(this).attr('label')+'</dt>';
$(this).find('option').each(function(){
if($(this).is(':selected')){
html += '<dd class="'+set.curselect+'">'+$(this).text()+'</dd>';
}else{
html += '<dd>'+$(this).text()+'</dd>';
}
});
});
}else{
$(this).find('option').each(function(){
if($(this).is(':selected')){
html += '<dd class="'+set.curselect+'">'+$(this).text()+'</dd>';
}else{
html += '<dd>'+$(this).text()+'</dd>';
}
}); }
/*将html插入到select框的后面*/
$('select').after(html); /*为了写起来方便，给外围的box和当前显示的select框还有自定义的下拉框一个简单的变量*/
thisbox = $('.'+set.selectbox);
thisselect = $('.'+set.showselect);
thisoption = $('.'+set.selectoption);
/*添加事件*/ /*默认显示框的选择事件，点击默认显示框，下拉列表会在可见与不可见状态之间切换*/
thisselect.toggle(function(){
/*$('.selectoption').hide();*/
thisbox.css('zindex',set.zindex);
thisoption.css('zindex',set.zindex+1);
thisoption.toggle();
},function(){
thisoption.css('zindex',set.zindex);
thisoption.toggle();
}); /*下拉列表的选择事件*/
thisoption.find('dd').click(function(){
$(this).addClass(set.curselect).siblings().removeClass(set.curselect);
var index = thisoption.find('dd').index(this);
thisselect.text($(this).text());
$(this).find('option').eq(index).prop('selected',true);
thisoption.hide();
}); /*点击默认显示框时要给我隐藏的input获得焦点*/
thisselect.click(function(){
$('input')[0].focus();
}) var index = 0;
/*下拉列表的键盘事件*/
$("input").keyup(function(e){
var keycode = e.which;
console.log(keycode);
var ddtarget = thisoption.find('dd');
/*向下*/
if(keycode == 40){
index++;
console.log(index);
if(index == ddtarget.length){
index = 0;
console.log(index);
}
/* 设为当前选中项,同時在默认显示的select框中同步显示*/
thisoption.find('dd').eq(index).addClass(set.curselect).siblings().removeClass(set.curselect);
var ddindex = thisoption.find('dd').eq(index).index(this);
thisselect.text(thisoption.find('dd').eq(index).text());
$(this).find('option').eq(ddindex).prop('selected',true);
}
/*向上*/
if(keycode == 38){ console.log(index);
if(index == 0){
index = ddtarget.length;
console.log(index);
}
index--;
/* 设为当前选中项，同時在默认显示的select框中同步显示*/
thisoption.find('dd').eq(index).addClass(set.curselect).siblings().removeClass(set.curselect);
var ddindex = thisoption.find('dd').eq(index).index(this);
thisselect.text(thisoption.find('dd').eq(index).text());
$(this).find('option').eq(ddindex).prop('selected',true);
}
/*按下Esc 隐藏弹出层*/
if (keycode == 27) {
console.log('esc');
if (thisoption.is(":visible")) {
thisoption.hide();
}
}
}); /*点击select框之外的其他部分的时候select框应该收起*/
$('html,body').click(function(e){
/* 判断当前的点击事件目标不是set.selectoption这个class*/
if(e.target.className.indexOf(set.selectoption)==-1){
thisoption.hide();
thisbox.css('zIndex',set.zindex);
}
}); /*取消下拉列表选择事件的冒泡*/
thisoption.find('dd').click(function(e){
e.stopPropagation();
}); }
})(jQuery);
$('.my_select').newStyle(); </script>
</body>
</html>
实现的思路是：将一个input框隐藏在默认显示的selected框下面，点击默认显示框时同时是它获得焦点，然后获得键盘事件，对自定义的select下拉框实现一系列的操作。
关键代码：
/*点击默认显示框时要给我隐藏的input获得焦点*/
thisselect.click(function(){
$('input')[0].focus();
});
TIPS：1.要有输入，才有键盘的事件，不然怎么读取呢？
2.键盘上下选择时最后一个和第一个的切换值得注意，要连贯。
是的，到这里还不是结束，那么我还可以做点什么呢？ 让我的代码更好看一点吧。
第三个版本：
学习插件写法，让我的代码也可以暴露方法给别人用
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery.min.js"></script> <style> /* 这里来定义你自己的select框的样式 */
.i_selectbox {
margin-top:20px;
height:32px;
position:relative;
font-size:14px
}
/* 默认显示的select框*/
.i_selectbox .i_currentselected {
width:150px;
height:24px;
background:url(select.png) 176px 4px no-repeat;
border:1px solid #cdcdcd;
text-indent:10px;
line-height:24px;
cursor:pointer
}
/* 这里是隐藏的input框 */
#hiddenput {
display: block;
width:200px;
height:18px;
margin-top: -25px;
position: absolute;
z-index:-2;
opacity:0;
filter:alpha(opacity=0);
}
/* 下拉选择框 */
.i_selectbox .i_selectoption {
overflow-x:hidden;
overflow-y:hidden;
position:absolute;
left:0px;
top:17px;
padding:5px;
background-color:#fff;
background:rgba(255,255,255,.9);
border:1px solid #eee
}
.i_selectbox .i_selectoption dt {
height:24px;
background-color:#eee;
text-indent:5px;
font-style:italic;
color:#555;
line-height:24px;
}
.i_selectbox .i_selectoption dd{
margin-left: -3px;
height:30px;
border-bottom:1px solid #cdcdcd;
cursor:pointer;
text-indent:2px;
line-height:30px
}
.i_selectbox .i_selectoption dd:hover{
background-color:#cdcdcd;
color:#fff
}
.i_selectbox .i_selectoption dd.selected{
background-color:#f17f36;
color:#fff
}
/* 这里是新定义的按钮 */
#optionShow {
display:block;
position: absolute;
margin-left: 300px; }
#optionHide {
display:block;
position: absolute;
margin-left: 300px;
margin-top: 50px;
} </style> <head>
<body>
<select class="my_select"> <option value="0">Alabama</option>
<option value="1">Alaska</option>
<option value="2">Arizona</option> <option value="3">Arkansas</option>
<option value="4">California</option>
<option value="5">Colorado</option> <option value="6">Connecticut</option>
<option value="7">Delaware</option>
<option value="8">Columbia</option>
<option value="9">Florida</option> </select>
<input type="button" id="optionShow" name="optionShow" value="点击这里显示下拉框"/>
<input type="button" id="optionHide" name="optionHide" value="点击这里隐藏下拉框"/>
<script>
(function($){
/*这个对象定义的位置值得注意*/
var set = {
selectbox : 'i_selectbox',
showselect : 'i_currentselected',
selectoption : 'i_selectoption',
curselect : 'selected',
width : 200,
height :150,
zindex : 2
}
$.fn.extend({ /*插件写法的函数*/
newStyle : function(){ /*让最初的select隐藏*/
$(this).hide();
/*动态写进去html替代原本的select*/
var html = '<div class="'+set.selectbox+'" style="zindex:'+set.zindex+'">'
+'<div class="'+set.showselect+'" style="width:'+set.width+'px;">'+$(this).find('option:selected').text()+'</div>'
+'<input type="text" id="hiddenput" name="hiddenput"/>'
+'<dl class="'+set.selectoption+'" style="display:none;width:'+set.width+'px" >';
if($(this).find('optgroup').size()>0){
$(this).find('optgroup').each(function(){
html += '<dt>'+$(this).attr('label')+'</dt>';
$(this).find('option').each(function(){
if($(this).is(':selected')){
html += '<dd class="'+set.curselect+'">'+$(this).text()+'</dd>';
}else{
html += '<dd>'+$(this).text()+'</dd>';
}
});
});
}else{
$(this).find('option').each(function(){
if($(this).is(':selected')){
html += '<dd class="'+set.curselect+'">'+$(this).text()+'</dd>';
}else{
html += '<dd>'+$(this).text()+'</dd>';
}
}); }
/*将html插入到select框的后面*/
$('select').after(html); /*为了写起来方便，给外围的box和当前显示的select框还有自定义的下拉框一个简单的变量*/
thisbox = $('.'+set.selectbox);
thisselect = $('.'+set.showselect);
thisoption = $('.'+set.selectoption);
/*添加事件*/ /*默认显示框的选择事件，点击默认显示框，下拉列表会在可见与不可见状态之间切换*/
thisselect.toggle(function(){
/*$('.selectoption').hide();*/
thisbox.css('zindex',set.zindex);
thisoption.css('zindex',set.zindex+1);
thisoption.toggle();
},function(){
thisoption.css('zindex',set.zindex);
thisoption.toggle();
}); /*下拉列表的选择事件*/
thisoption.find('dd').click(function(){
$(this).addClass(set.curselect).siblings().removeClass(set.curselect);
var index = thisoption.find('dd').index(this);
thisselect.text($(this).text());
$(this).find('option').eq(index).prop('selected',true);
thisoption.hide();
}); /*点击默认显示框时要给我隐藏的input获得焦点*/
thisselect.click(function(){
/*这里面[0]起了很大作用喔*/
$('input')[0].focus();
}) var index = 0;
/*下拉列表的键盘事件*/
$("#hiddenput").keyup(function(e){
var keycode = e.which;
console.log(keycode);
var ddtarget = thisoption.find('dd');
/*向下*/
if(keycode == 40){
index++;
if(index == ddtarget.length){
index = 0;
}
/* 设为当前选中项,同時在默认显示的select框中同步显示*/
thisoption.find('dd').eq(index).addClass(set.curselect).siblings().removeClass(set.curselect);
var ddindex = thisoption.find('dd').eq(index).index(this);
thisselect.text(thisoption.find('dd').eq(index).text());
$(this).find('option').eq(ddindex).prop('selected',true);
}
/*向上*/
if(keycode == 38){
if(index == 0){
index = ddtarget.length;
}
index--;
/* 设为当前选中项，同時在默认显示的select框中同步显示*/
thisoption.find('dd').eq(index).addClass(set.curselect).siblings().removeClass(set.curselect);
var ddindex = thisoption.find('dd').eq(index).index(this);
thisselect.text(thisoption.find('dd').eq(index).text());
$(this).find('option').eq(ddindex).prop('selected',true);
}
/*按下Esc 隐藏弹出层*/
if (keycode == 27) {
console.log('esc');
if (thisoption.is(":visible")) {
thisoption.hide();
}
}
}); /*点击select框之外的其他部分的时候select框应该收起*/
$('html').click(function(e){
/* 判断当前的点击事件目标不是set.selectoption这个class*/
if(e.target.className.indexOf(set.selectoption)==-1){
thisoption.hide();
thisbox.css('zIndex',set.zindex);
}
}); /*取消下拉列表选择事件的冒泡*/
thisoption.find('dd').click(function(e){
e.stopPropagation();
}); },/*newStyle函数结束*/
showSelect : function(){
$(this).click(function(e){
$(".i_selectoption").show();
//$('.'+set.selectoption).show();
/*之前曾给html添加过点击selectoption收起的事件啊！！不阻止冒泡的话会发生冲突啊！！问题找了好久啊！！！*/
e.stopPropagation();
}); },
hideSelect : function(){
$(this).click(function(){
$('.'+set.selectoption).hide();
});
}
})
})(jQuery); $('.my_select').newStyle();
$('#optionShow').showSelect();
$('#optionHide').hideSelect(); </script>
</body>
</html>
TIPS：1.如果你想定义一个对象供所有的插件方法可用的话，那么应该定义到上面代码中那样全局的位置；
2.(function($){........})(jQuery);这样写法可以使得外部无法访问到函数内部的公共变量和对象的命名空间；
3.注意可能冲突的事件之间有可能存在事件冒泡的影响！！
4.可以多学习多参考各种各样的代码调试方法，这个真的很重要。
通过一个简单的功能，我学到的东西很多喔，事实证明，冷静的思考，不放弃的探索才是最好的学习办法。
自定义样式的select下拉框深入探索的更多相关文章
- select下拉框的探索（<option></option>标签中能嵌套使用其它标签吗）
select标签大家应该经常用到,有个问题可能没怎么注意过, select标签里面的option标签可以嵌套其它标签吗,比如i,span标签等? 经本人测试,答案是:可以嵌套其它标签,但审查元素会 ...
- 去除select下拉框默认样式
去除select下拉框默认样式 select { /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ border: solid 1px #; /*很关键:将默认的select选 ...
- 非常实用的select下拉框-Select2.js
在Web开发中,Select下拉框是常用的输入组件.由于原生的Select几乎很难通过CSS样式控制.一些好看的Select下拉框就只能通过模拟来实现.PHP程序员雷雪松给大家推荐一筐款不错的Sele ...
- 在element-ui的select下拉框加上滚动加载
在项目中,我们需要运用到很多来自后端返回的数据.有时是上百条,有时甚至上千条.如果加上后端的多表查询或者数据量过大,这就导致在前端的显示就会及其慢,特别是在网络不好的时候更是如此. 自然,后端就做了一 ...
- 一款基于jQuery的联动Select下拉框
今天我们要来分享一款很实用的jQuery插件,它是一个基于jQuery多级联动的省市地区Select下拉框,并且值得一提的是,这款联动下拉框是经过自定义美化过的,外观比浏览器自带的要漂亮许多.另外,这 ...
- jQuery制作简洁的多级联动Select下拉框
今天我们要来分享一款很实用的jQuery插件,它是一个基于jQuery多级联动的省市地区Select下拉框,并且值得一提的是,这款联动下拉框是经过自定义美化过的,外观比浏览器自带的要漂亮许多.另外,这 ...
- firefox浏览器中 bootstrap 静态弹出框中select下拉框不能弹出（解决方案）
问题出现场景1: 在firefox浏览器中在bootstrap弹出的modal静态框中再次弹出一个静态框时 select下拉框不能弹出选项 解决方案:去掉最外层静态框的 tabindex=" ...
- 简述Object(ActiveX)控件遮挡Dialog、select下拉框的解决办法
1.背景 最近在做项目的过程中,我们使用了Object控件,但是同时在上面写了一个select下拉框,因此每次点击下拉框的时候我们会发现,下拉框的部分内容被Object控件给遮挡了,调查研究后发现,我 ...
- s:select下拉框validation验证
S:select下拉框验证: <td colspan="5"> <s:select name="vo.typeVO.corp" list=&q ...
随机推荐
- 关于C++的递归调用（n的阶乘为例）
C++,是入门编程界的一门初期的语言.今天我们浅谈一下有关C++的递归调用. 在没有继承,多态,封装之前,C++几乎看成是C语言,除了一些简单的输出和头文件. 具体代码实现如下: #include&l ...
- 解决canvas转base64/jpeg时透明区域变成黑色背景的方法
最近在工作遇到一个问题,在将png图片转jpeg时,透明区域被填充成黑色,通过网上的介绍找到了解决的方法,现在总结下分享给同样遇到这个问题的朋友们,感兴趣的可以通过本文详细学习下. 在用canvas将 ...
- RTMP协议中文翻译(首发)（转）
Adobe公司的实时消息传输协议 摘要 此备忘录描述了 Adobe公司的实时消息传输协议(RTMP),此协议从属于应用层,被设计用来在适合的传输协议(如TCP)上复用和打包多媒体传输流(如音频.视频和 ...
- 利用chrome的profiler查找js的memory leak
1. 首先要固定一个测试环境.具体来说,选择某一个可以重复的操作,作为标准的测试动作. 2. 刷新浏览器后用profiler抓下heap snapshot. 3. 进行操作,再一次抓下snapshot ...
- J2EE中EL表达式
EL全名为Expression Language. EL语法很简单,主要的语法结构是${sessionScope.user.sex}所有EL都是以${为起始.以}为结尾的. 上述EL范例的意思是:从S ...
- nodejs研究笔记
首先呢,安装 1:安装mongodb-win32-x86_64-3.2.5-signed.msi 2:手动创建目录 如 C:\data\db 及 C:\data\dbConf 3:管理员身份运行 cm ...
- git push --help
git-push(1) Manual Page NAME git-push - Update remote refs along with associated objects SYNOPSIS gi ...
- Popup - 弹出层
//图片类快捷弹出层 <a href="" target="_blank"> <div class="panlifang1" ...
- 自己封装的一个无限滚动 mark 待传
@import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...
- 那年有关 return ; 的一切
现在只知道在dev C++里面声明了函数的返回类型不为void就不能写return; ,但是如果返回值为void就可以写return; ,而且如你所愿.