标签 layui 下的文章
Thinkphp5.0使用layui修改默认success和error弹框
1 修改跳转页面对应的模板文件配置
// 文件位置 application/config.php (不想直接thinkphp框架中的源文件,因为在git clone之后composer install只会安装框架源文件)
'dispatch_success_tmpl' => THINK_PATH . 'tpl' . DS . 'dispatch_jump.tpl',
'dispatch_error_tmpl' => THINK_PATH . 'tpl' . DS . 'dispatch_jump.tpl',
// 修改(路径可看个人习惯)
'dispatch_success_tmpl' => ROOT_PATH . 'tpl' . DS . 'dispatch_jump.tpl',
'dispatch_error_tmpl' => ROOT_PATH . 'tpl' . DS . 'dispatch_jump.tpl',
2 创建跳转页面并添加内容
{__NOLAYOUT__}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<title>跳转提示</title>
<script src="__STATIC__/lib/jquery.min.js"></script> <!-- 必须先引入jQuery1.8或以上版本 -->
<script src="__STATIC__/layui/layui.js"></script> <!-- 根据自己的环境自行引入layui.js -->
</head>
<body>
<div class="system-message">
<input type="hidden" id="msg" value="<?php echo(strip_tags($msg));?>" />
<input type="hidden" id="url" value="<?php echo(strip_tags($url));?>" />
<input type="hidden" id="wait" value="<?php echo(strip_tags($wait));?>" />
</div>
<script type="text/javascript">
(function(){
var msg=$('#msg').val();
var url1=$('#url').val();
var wait=$('#wait').val();
layui.use('layer', function(){
var layer = layui.layer;
layer.open({
content:msg,//提示信息
success:function(layero,index){
var interval = setInterval(function(){
var time = --wait;
if(time <= 0) {
location.href = url1;
clearInterval(interval);
};
}, 1000);
}
})
});
})();
</script>
</body>
</html>
3 通过以上两步就可测试 $this->error(); 和 $this->success(); 方法了
修改layui的表单手机、邮箱验证可以为空
问题描述
在使用layui表单验证的时候遇到这么个问题,用layui自带的 lay-verify 验证手机或者邮箱的时候,如果该字段在空的情况下提交也会提示手机或者邮箱格式不正确,我想要的效果是用户可以不填,如果填的话才进行手机或者邮箱验证
TP5+layedit 图片上传
html+js
<textarea id="demo" style="display: none;"></textarea>
<script>
layui.use('layedit', function(){
var layedit = layui.layedit;
uploadImage: {
//上传操作 后台Article控制器的layeditUpload方法
url: '{:U("Admin/Article/layeditUpload")}' //接口url
,type: '' //默认post
}
layedit.build('demo'); //建立编辑器
});
</script>
php接收上传代码
public function layeditUpload(){
$file = request()->file('file');
// 移动到框架应用根目录/public/uploads/ 目录下
$info = $file->move(ROOT_PATH . 'public' . DS . 'layeditUpload');
$reubfo = array(); //定义一个返回的数组
if($info){
$reubfo['code']= 0;
$reubfo['msg']= '上传成功';
$reubfo['data']['src']= "/layeditUpload/".$info->getSaveName();
}else{
// 上传失败获取错误信息
$reubfo['code']= -1;
$reubfo['err'] = $file->getError();
}
return json($reubfo);
}
TP5 + layui 文件上传操作(转)
1.HTML部分
<div class="layui-upload" style="margin-left:110px;">
<button type="button" class="layui-btn" id="test1">更新头像</button>
<div class="layui-upload-list">
<img class="layui-upload-img" id="demo1" src="{$data.icon??''}">
<p id="demoText"></p>
</div>
</div>
注: img的src的值是做的回选,根据需要选择