利用layer实现弹出层效果
先看效果:
第一步:下载弹出层插件
大概这个样子:
我用的tp5框架,记住要把下载的所有的这些文件都放在框架里面:不然会没样式!!!!
第二步:代码实现
index.html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<script src="__STATIC__/js/jquery-3.3.1.min.js"></script>
<script src="__STATIC__/js/layer/layer.js"></script>
<body>
<form method="post">
<p><input type="text" name="username" id='username'></p>
<input type="button" value="提交" id='sub' name='sub' onclick="fun()">
</form>
</body>
<script type="text/javascript">
function fun()
{
var username=$('#username').val();
if(username=='')
{
layer.msg('手机号不能为空', {
offset: 't',
anim: 2`
});
}
}
</script>
</html>
没用到控制器,直接用视图就可以测试。
总之:引入html即可使用
更多样式请看:https://layer.layui.com/
教程完毕:over,over