<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="https://www.layuicdn.com/layui/css/layui.css">
</head>
<body>
<form class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">输入框</label>
<div class="layui-input-inline">
<input type="text" name="" placeholder="请输入" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn test">测试</button>
</div>
</div>
</form>
<script src="https://www.layuicdn.com/layui/layui.js"></script>
<script>
layui.use(['laytpl', 'jquery', 'layer', 'form'], function() {
var laytpl = layui.laytpl,
layer = layui.layer,
form = layui.form,
$ = layui.$;
$('.test').click(function() {
layer.msg("测试成功");
});
});
</script>
</body>
</html>点击测试按钮后,应该弹出信息“测试成功”,但是运行后页面刷新了。
原因
button 的 type 属性,Internet Explorer 的默认类型是 "button",而其他浏览器中(包括 W3C 规范)的默认值是 "submit"。
解决
为按钮规定 type 属性。
<button type="button" class="layui-btn test" >测试</button>
有好的文章希望我们帮助分享和推广,猛戳这里我要投稿


还没有评论,来说两句吧...