目录
自定义弹框(模块框)
HTML
<div style="display:none" id="model"></div>
<div style="display:none" id="notice_div" class="notice_div">
<div id="notice_header">
<div id="notice_title">提示信息</div>
</div>
<div id="notice_content">
<div id="notice_msg">信息</div>
</div>
<div id="notice_action">
<button class="confirm_btn" οnclick="cancel()">确认</button>
<button class="return_btn" οnclick="cancel()">返回</button>
</div>
</div>
CSS
#model {
width:100%;
height:200%;
position:fixed;
left:0;
top:0;
background:black;
opacity:0.8;
}
#notice_div {
width: 40%;
height:200px;
position:fixed;
left:30%;
top: 20%;
height:30%;
text-align:center;
font-size:18px;
}
#notice_header {
height: 50px;
background-color:#1e88d4;
border-radius: 10px 10px 0 0;
color: black;
font-weight:900;
}
#notice_title {
padding-top:12px;
}
#notice_content {
height:100px;
background-color:#d3d7cf;
border-top:1px solid gray;
border-bottom:1px solid gray;
}
#notice_action {
height:50px;
background-color:#d3d7cf;
text-align:center;
border-radius: 0 0 10px 10px;
}
#notice_msg {
margin-top:30px;
color: black;
}
.confirm_btn, .return_btn {
text-align: center;
width: 100px;
height: 35px;
line-height: 35px;
margin-top:7px;
letter-spacing: 5px;
text-indent: 10px;
background: #1e88d4;
border: 1px solid #1e88d4;
border-radius: 5px;
display: inline-block;
cursor:pointer;
}
.return_btn {
background: #9ea09a;
border: 1px solid #9ea09a;
}
JavaScript
function alert_msg(content, title="提示信息") {
$("#notice_title").html(title);
$("#notice_msg").html(content);
$("#model").show();
$("#notice_div").show();
}
function cancel() {
$("#model").hide();
$("#notice_div").hide();
}
HTML新增标签
HTML5新增属性
输入框自动获得焦点
autofocus属性,可以直接写input标签中该属性即可(不用赋值)。也可以赋值为true或者“autofocus",都可以开启自动获得焦点。
<input type="text" autofocus />
<input type="text" autofocus=true />
<input type="text" autofocus="autofocus" />
自动补全
autocomplete属性,默认的是on,也就是开启了自动补全功能。可以设置为off,即可关闭自动补全。
示例:
<input type="text" autocomplete="on" />
<input type="text" autocomplete="off" />
如果想要全部禁用input的自动补全功能,可以使用jquery实现:
$("input").attr("autocomplete", "off")