Html
    Css
    Js

    
                        
/**select start****/
.select-text {
	padding:0 35px 0 5px;
	border:1px solid #ddd;
}
.select-text input {
	border:0 none;
	background:none;
	width:100%;
	height:30px;
	line-height:30px;
	vertical-align:middle;
	font-size:14px;
}
.select-text>i {
	display:inline-block;
	height:0px;
	width:0px;
	position:absolute;
	right:8px;
	top:50%;
	margin-top:-4px;
	border-width:8px;
	border-color:rgba(0,0,0,0);
	border-style:solid;
	border-top-color:#c61620;
	cursor:pointer;
}
.select-mod ul,.select-mod li {
	list-style:none;
	margin:0;
	padding:0;
}
.select-mod {
	position:relative;
	font-size:14px;
	/*min-width:120px;
	*/
	/*max-width:160px;
	*/
}
.select-lsit {
	position:absolute;
	left:0;
	right:0;
	top:29px;
	border:1px solid #ddd;
	background:#fff;
	z-index:1000;
}
.select-lsit>li {
	padding:5px 10px;
	background:#fff;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.select-lsit>li:hover {
	background:#f3f3f3;
	cursor:pointer;
}
.select-text label {
	height:28px;
	line-height:28px;
	display:inline-block;
	width:100%;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	cursor:pointer;
	vertical-align:middle;
}
/**select end****/

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

模拟下拉框插件

$$("#selectBox", {
    "selctList": [{
        'name': '选择1',
        'value': '1'
    }, {
        'name': '选择2',
        'value': '2'
    }],
    "name": "addd"
}, function(elm) {});

是渲染select框的方法,方法的最后一个回调函数可以不用传,此参数是select改变时触发的回调函数

1
      网站/shl设计0
      2017/8/21 11:16:49
      默认选中怎么使用。 回复