layui上傳圖片
❶ 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框架寫出下面的樹狀圖和表格
layui里沒有統計圖的組件,這個需要用Echarts來做
下面的表格用layui做也不好做,layui的樣式不是很好調整
❸ 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表單中,有AJAX方式來提交表單嗎
在LayUI表單中,有AJAX方式提交表單,在表單提交監聽那裡,解決方法如下:
1、layui本身內置了很多驗證方法,只需要按照規則預設元素屬性,就可以做到一些基本的驗證。layui中預設lay-verify來提供驗證,基本驗證包含如下圖。
❺ 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 );
❻ layui 怎麼把t裡面的圖片放小
1
layui沒辦法與form表單中的其他欄位一同提交到後台,所以只能通過先提交圖片,然後通過返回的圖片的值來提交到資料庫
2
先將所需要的jar包導入,我是用的maven所以,需要在父pom.xml文
❼ layui多圖片怎麼按名稱順序上傳
這個跟layui沒關系,後台代碼可以獲取到上傳文件的文件名,然後存庫的時候再根據文件名排個序保存就可以了.
❽ 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多文件上傳,只能取到一個文件的問題
你可以把文件壓縮成rar或者zip文件再進行上傳,這樣避免文件漏傳或者損害,也可以多個進行上傳,再在主機裡面解壓就可以了,希望能幫到你。
❿ 請問網站後台上傳圖片顯示不出來是怎麼回事呢
網站後台上傳圖片顯示不出來是設置錯誤造成的,解決方法為:
1、前台頁面。