想给layui load加点文字提示，显示"加载中"，该怎么做呢？
下面介绍了两种"加载中"的效果：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>layui load加文字提示</title>
<link href="https://unpkg.com/layui@2.7.6/dist/css/layui.css" rel="stylesheet">
</head>
<body>
<script src="https://unpkg.com/layui@2.7.6/dist/layui.js"></script>
<script>
layui.use(['layer'], function(){
var layer = layui.layer;
});
//第一种
var index1 = layer.load(1, {
shade: [0.1, '#fff'],
content: '<span class="loadtip">加载中</span>',
success: function (layer) {
layer.find('.layui-layer-content').css({
'padding-top': '40px',
'width': '100px',
});
layer.find('.loadtip').css({
'font-size':'20px',
'margin-left':'-18px'
});
}
});
//第二种
// var index2 = layer.load(3, {
// shade: [0.1, '#fff'],
// content: '<span class="loadtip">加载中</span>',
// success: function (layer) {
// layer.find('.layui-layer-content').css({
// 'padding-top': '30px',
// 'width': '100px',
// });
// layer.find('.loadtip').css({
// 'font-size':'18px',
// 'margin-left':'5px'
// });
// }
// });
//关闭加载
// layer.close(index1)
// layer.close(index2 )
</script>
</script>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>layui load加文字提示</title>
<link href="https://unpkg.com/layui@2.7.6/dist/css/layui.css" rel="stylesheet">
</head>
<body>
<script src="https://unpkg.com/layui@2.7.6/dist/layui.js"></script>
<script>
layui.use(['layer'], function(){
var layer = layui.layer;
});
//第一种
var index1 = layer.load(1, {
shade: [0.1, '#fff'],
content: '<span class="loadtip">加载中</span>',
success: function (layer) {
layer.find('.layui-layer-content').css({
'padding-top': '40px',
'width': '100px',
});
layer.find('.loadtip').css({
'font-size':'20px',
'margin-left':'-18px'
});
}
});
//第二种
// var index2 = layer.load(3, {
// shade: [0.1, '#fff'],
// content: '<span class="loadtip">加载中</span>',
// success: function (layer) {
// layer.find('.layui-layer-content').css({
// 'padding-top': '30px',
// 'width': '100px',
// });
// layer.find('.loadtip').css({
// 'font-size':'18px',
// 'margin-left':'5px'
// });
// }
// });
//关闭加载
// layer.close(index1)
// layer.close(index2 )
</script>
</script>
</body>
</html>
演示效果如下图所示：
