thinkphp5加layui实现图片上传功能(带图片预览)

网站中很多表单都会用到上传图片,logo,照片,用户也会上传图片,这个时候网站就需要一个上传图片的功能,而且在上传后希望能预览一下看上传的对不对。

thinkphp5加layui实现图片上传功能(带图片预览)思路,异步传输图片并预览,将异步上传后的值返回表单隐藏域再提交。

1、引入文件

首先,要引入jQuery文件,这是必须的


2、HTML部分

style="height: 30px;" />

3、功能实现

4、后台处理

图片上传

public function upload_img(){
	$file = request()->file('file');
	if($file==null){
		exit(json_encode(array('code'=>1,'msg'=>'没有文件上传')));
	}
	$info = $file->move(ROOT_PATH.'public'.DS.'uploads');
	$ext = ($info->getExtension());
	if(!in_array($ext,array('jpg','jpeg','gif','png'))){
		exit(json_encode(array('code'=>1,'msg'=>'文件格式不支持')));
	}
	$img = '/uploads/'.$info->getSaveName();
	exit(json_encode(array('code'=>0,'msg'=>$img)));
}

保存内容

public function save(){
	$id = (int)input('post.id');
	$data['title'] = trim(input('post.title'));
	$data['channel_id'] = (int)input('post.channel_id');
	$data['charge_id'] = (int)input('post.charge_id');
	$data['area_id'] = (int)input('post.area_id');
	$data['img'] = trim(input('post.img'));
	$data['url'] = trim(input('post.url'));
	$data['keywords'] = trim(input('post.keywords'));
	$data['desc'] = trim(input('post.desc'));
	$data['status'] = (int)input('post.status');

	if($data['title'] == ''){
		exit(json_encode(array('code'=>1,'msg'=>'影片名称不能为空')));
	}
	if($data['url'] == ''){
		exit(json_encode(array('code'=>1,'msg'=>'影片地址不能为空')));
	}

	if($id){
		$this->db->table('video')->where(array('id'=>$id))->update($data);
	}else{
		$data['add_time'] = time();
		$this->db->table('video')->insert($data);
	}
	exit(json_encode(array('code'=>0,'msg'=>'保存成功')));
}

到此这篇关于thinkphp5加layui实现图片上传功能(带图片预览)的文章就介绍到这了,更多相关thinkphp+layui图片上传内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

你可能感兴趣的:(thinkphp5加layui实现图片上传功能(带图片预览))