这是我自己的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet"/>
<script type="text/javascript" charset="utf-8">
mui.init();
</script>
</head>
<body style="background: #000000;">
<img src="image/unlight.png" id="tupian" style="margin: auto; display: block;">
<div class="mui-switch" id="onoff" style="margin: auto;">
<div class="mui-switch-handle" ></div>
</div>
</body>
<script>
document.querySelector("#onoff").addEventListener("toggle",function(e){
if(e.detail.isActive)
{
document.querySelector("body").style.background="#000000";
document.querySelector("#tupian").src="image/light.png";
}else
{
document.querySelector("body").style.background="#000000";
document.querySelector("#tupian").src="image/unlight.png";
}
})
</script>
</html>
如图,我点了按钮没什么反应,可是用其他浏览器有效果
还有按勾选的,都是老式的
这是兼容问题还是什么?!弄得头疼啊
学校机房却没这种问题。
0 个回复