一、html
<h3>Checkbox</h3>
<div class="mycheck">
<input type="checkbox" id="myCheck" name="demo" value="1">
<label for="myCheck"></label>
<button type="button" id="selectBox">选中</button>
<input type="radio" id="myRadio" name="radiobox" value="2">
<label for="myRadio" class="myRadio"></label>
</div>
二、css
<style type="text/css">
/*radio*/
#myRadio + label{
/*background-color: #999999;*/
border-radius: 50%;
border:1px solid #999999;
width:20px;
height:20px;
display: inline-block;
text-align: center;
vertical-align: middle;
line-height: 20px;
}
#myRadio:checked + label{
background-color: #1f59a3;
}
#myRadio:checked + label:after{
content:"\2714";
color: #ffffff;
}
/*checkbox*/
#myCheck + label{
/*background-color: #999999;*/
border-radius: 2px;
border:1px solid #999999;
width:20px;
height:20px;
display: inline-block;
text-align: center;
vertical-align: middle;
line-height: 20px;
}
#myCheck:checked + label{
background-color: #1f59a3;
}
#myCheck:checked + label:after{
content:"\2714";
color: #ffffff;
}
input[type="checkbox"]{
display: none;
}
</style>
三、js
function IEVersion() {
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器
var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
if(isIE) {
var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
reIE.test(userAgent);
var fIEVersion = parseFloat(RegExp["$1"]);
if(fIEVersion <= 8) {
$(".mycheck input").css("display", "inline-block");
$(".mycheck label").css("display", "none");
}
} else if(isEdge) {
alert( 'edge');//edge
$(".mycheck input").css("display", "inline-block");
$(".mycheck label").css("display", "none");
} else if(isIE11) {
alert(11); //IE11
}else{
alert(-1);//不是ie浏览器
}
}