当前位置:首页 » 文件传输 » layui上传图片
扩展阅读
webinf下怎么引入js 2023-08-31 21:54:13
堡垒机怎么打开web 2023-08-31 21:54:11

layui上传图片

发布时间: 2022-01-14 07:37:04

‘壹’ layui文件上传 接口怎么写

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>文件上传</title> <link rel="stylesheet" href="layui/css/layui.css"> <link rel="stylesheet" href="css/global.css"> </head> <body> <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;"> <legend>设定上传文件的格式</legend> </fieldset> <input type="file" name="file" class="layui-upload-file"> <input type="file" name="file1" lay-type="file" class="layui-upload-file"> <input type="file" name="file1" lay-type="audio" class="layui-upload-file"> <input type="file" name="file2" lay-type="video" class="layui-upload-file"> <blockquote class="layui-elem-quote" style="margin-top: 20px;">支持拖动文件上传</blockquote> <fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;"> <legend>演示上传</legend> </fieldset> <div class="site-demo-upload"> <img id="LAY_demo_upload" src="layui/images/tong.jpg"> <div class="site-demo-upbar"> <input type="file" name="file" class="layui-upload-file" id="test"> </div> </div> <p style="margin-top: 20px;">注:由于服务器资源有限,所以此处每次给你返回的是同一张图片</p> <script src="layui/layui.js"></script> <script> layui.use('upload', function(){ layui.upload({ url: '' //上传接口 ,success: function(res){ //上传成功后的回调 console.log(res) } }); layui.upload({ url: '/test/upload.json' ,elem: '#test' //指定原始元素,默认直接查找class="layui-upload-file" ,method: 'get' //上传接口的http类型 ,success: function(res){ LAY_demo_upload.src = res.url; } }); }); </script> </body></html>

‘贰’ layui 中 <div> 如何加入 lay-verify="required" 标签

首先看你的的控制台有没有报错加载不到layer.js或者form.js

然后你的整个表单必须有form层

我把代码和整个目录结构给你看

1、目录结构

2、代码

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body style="padding: 10px;">
<form class="layui-form" action="">
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-inline">
<input type="text" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">角色</label>
<div class="layui-input-block">
<select name="gid" lay-verify="">
<option value="">请选择</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密 码</label>
<div class="layui-input-inline">
<input type="text" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">姓 名</label>
<div class="layui-input-inline">
<input type="text" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">状 态</label>
<div class="layui-input-inline">
<input type="checkbox" lay-skin="primary">
</div>
</div>
</form>
<link rel="stylesheet" type="text/css" href="./layui/css/layui.css">
<script type="text/javascript" src="./layui/layui.all.js"></script>
<script type="text/javascript">
//一般直接写在一个js文件中
layui.use(['layer', 'form'], function(){
var layer = layui.layer
,form = layui.form;

layer.msg('Hello World');
});
</script>
</body>
</html>

3、结果图

‘叁’ 怎么用layui框架写出下面的树状图和表格

layui里没有统计图的组件,这个需要用Echarts来做
下面的表格用layui做也不好做,layui的样式不是很好调整

‘肆’ layui 怎么把t里面的图片放小

1

layui没办法与form表单中的其他字段一同提交到后台,所以只能通过先提交图片,然后通过返回的图片的值来提交到数据库

2

先将所需要的jar包导入,我是用的maven所以,需要在父pom.xml文

‘伍’ layui图片上传如何实现上传之前先预览

<head>
<meta charset='UTF-8'>
<meta name='Author' content='wanghua'>
<title>Test upload with Layui2</title>
<link rel='stylesheet' href='/assets/layui2/css/layui.css'/>
<style>
.thumb {margin-left:5px; margin-top:15px; height:128px}
#prevModal {width:100%; height:100%; text-align:center; display:none;}
#img_prev {max-width:98%; max-height:98%; margin: 10px auto}
</style>
</head>
<body>
<div class='layui-container' style='margin-top:15px'>
<button type="button" class="layui-btn" id="test1">
<i class="layui-icon"></i>选择图片

‘陆’ 在LayUI表单中,有AJAX方式来提交表单吗

在LayUI表单中,有AJAX方式提交表单,在表单提交监听那里,解决方法如下:

1、layui本身内置了很多验证方法,只需要按照规则预设元素属性,就可以做到一些基本的验证。layui中预设lay-verify来提供验证,基本验证包含如下图。

‘柒’ layui多图片怎么按名称顺序上传

这个跟layui没关系,后台代码可以获取到上传文件的文件名,然后存库的时候再根据文件名排个序保存就可以了.

‘捌’ layui文件上传接口怎么写

require_once "../common_mysql.php";
require_once MESSAGE_PATH . 'zh/zh_calendar_message.php';
require_once "function_common/user_function.php";
require_once "function_common/public_function.php";
global $DB;
$sql_time = microtime ( true );

//$uid = $self_userid;

//保存图片
$json_result ['status'] = 0;
$path = 'upfile';
$json_result ['status'] = 0;
$json_result ['successmsg'] = '传失败';
if (isset ( $_FILES ['imageZip'] )) {
$upfile = 'upfile/' . $_FILES ['imageZip'] ['name'];
if (! @file_exists ( $path )) {
@mkdir ( $path );
}
$result = @move_uploaded_file ( $_FILES ['imageZip'] ['tmp_name'], $upfile );
if (! $result) {
$json_result ['status'] = 0;
$json_result ['successmsg'] = '传失败';
$json_result ['datas'] = array ('savePath' => $upfile );
exit ( json_encode ( $json_result ) );
}
}

$json_result ['status'] = 1;
$json_result ['datas'] = array ('savePath' => $upfile );

‘玖’ 请问网站后台上传图片显示不出来是怎么回事呢

网站后台上传图片显示不出来是设置错误造成的,解决方法为:

1、前台页面。

‘拾’ 关于layui多文件上传,只能取到一个文件的问题

你可以把文件压缩成rar或者zip文件再进行上传,这样避免文件漏传或者损害,也可以多个进行上传,再在主机里面解压就可以了,希望能帮到你。