<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>图片批量上传</title>
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0"/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<style>
html,body{height:100%;margin:0;padding:0;background:#fff;}
ul{margin:0;padding:0;list-style:none;}
#wrap{padding:10px;}
#topbar{padding:10px 0;border-bottom:1px solid #e3e3e3;text-align:left;}
#topbar button {margin:0;margin-left:5px;outline:none;padding: 4px 16px;box-sizing: border-box;
display:inline-block;border:none;border-radius:3px;text-align:center;cursor:pointer;
font-size:14px;line-height:1.5;background-color:#f0f0f0;color:#223;
}
#topbar button.primary{background-color:#3d97d4;color:#fff;}
#topbar button:hover{background-color:#207ab7;color:#fff;}
#topbar button.removeall{float:right;}
#file_list {display:grid;grid-gap:10px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));padding-top:10px;}
#file_list:empty:after{content:'可以将本地图片直接拖拽到这里';color:#777;font-size:12px; min-width:300px;}
#file_list li{position:relative;display:block;vertical-align:top;padding:5px 5px;border-radius:5px;}
#file_list li.up-over {}
#file_list li.up-now {}
#file_list li.up-now:after{content:'';position:absolute;top:0;left:0;display:block;width:100%;height:100%;background:rgba(255,255,255,0.8) url(loading.gif) center center no-repeat;border-radius:5px;z-index:999;}
#file_list li:hover{background-color:#ddd;}
#file_list li .picbox {display:flex;flex:0 0 auto;justify-content:center;overflow:hidden;position:relative;width:100%;padding-top:100%;align-items:center;}
#file_list li .picbox img {display:block;max-width:100%;max-height:100%;position:absolute;
top:50%;left:50%;transform:translateX(-50%) translateY(-50%);}
#file_list li.up-over .picbox:after{content:url('data:image/svg+xml;%20charset=utf8,%3Csvg%20viewBox%3D%220%200%201024%201024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M512%200C229.376%200%200%20229.376%200%20512s229.376%20512%20512%20512%20512-229.376%20512-512S794.624%200%20512%200z%22%20fill%3D%22%234AC711%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M855.552%20394.752l-358.4%20358.4a50.9952%2050.9952%200%200%201-72.192%200l-204.8-204.8c-18.944-19.968-18.944-51.2%200-71.168a50.5344%2050.5344%200%200%201%2072.192-1.024L460.8%20644.608l322.048-322.048c19.968-18.944%2051.2-18.944%2071.168%200%2020.48%2019.456%2020.992%2051.712%201.536%2072.192z%22%20fill%3D%22%23FFFFFF%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');position:absolute;bottom:2px;right:2px;z-index:9;}
#file_list li .tools {display:none;position:absolute;bottom:5px;right:5px;z-index:99;}
#file_list li:hover .tools {display:block;}
#file_list li .tools .remove{cursor:pointer;}
#file_list li .tools .remove:after{content:url('data:image/svg+xml;%20charset=utf8,%3Csvg%20width=%2224%22%20height=%2224%22%20viewBox=%220%200%2024%2024%22%20xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath%20d=%22M17%206h3a1%201%200%200%201%200%202h-1v11a3%203%200%200%201-3%203H8a3%203%200%200%201-3-3V8H4a1%201%200%201%201%200-2h3V5a3%203%200%200%201%203-3h4a3%203%200%200%201%203%203v1zm-2%200V5a1%201%200%200%200-1-1h-4a1%201%200%200%200-1%201v1h6zm2%202H7v11a1%201%200%200%200%201%201h8a1%201%200%200%200%201-1V8zm-8%203a1%201%200%200%201%202%200v6a1%201%200%200%201-2%200v-6zm4%200a1%201%200%200%201%202%200v6a1%201%200%200%201-2%200v-6z%22%3E%3C/path%3E%3C/svg%3E');}
#file_list li .namebox {font-size:14px;line-height:20px;max-height:40px;overflow:hidden;padding:5px 10px;text-align:center;display:flex;justify-content:center;align-items:flex-start;}
#file_list li .namebox span{word-break:break-all;vertical-align:top;}
</style>
</head>
<body>
<div id="wrap">
<div id="topbar"><button class="addfile primary">+ 本地上传 </button><button class="upall primary" style="display:none;">全部上传</button><button class="removeall">清空列表</button></div>
<ul id="file_list"></ul>
</div>
<script>
var editor=parent.tinymce.activeEditor;
var axupimgs=parent.axupimgs;
axupimgs.res = []; //存放本地文件的数组
var blobInfo = {file:null}
blobInfo.blob = function(){return this.file;}
var upload_handler = axupimgs.images_upload_handler;
var upload_base_path = axupimgs.images_upload_base_path;
//为列表添加排序
function reSort(){
document.querySelectorAll('#file_list li').forEach((el,i)=>{
el.setAttribute('data-num',i);
});
}
function addList(files){
var files_sum = files.length;
var vDom = document.createDocumentFragment();
for(let i=0;i<files_sum;i++){
let file = files[i];
let blobUrl = window.URL.createObjectURL(file);
axupimgs.res.push({file:file,blobUrl:blobUrl,url:''});
let li = document.createElement('li');
li.setAttribute('class','up-no');
li.setAttribute('data-time',file.lastModified);
li.innerHTML='<div class="picbox"><img src="'+blobUrl+'"></div><div class="namebox"><span>'+file.name+'</span></div><div class="tools"><a class="remove"></a></div>';
vDom.appendChild(li);
}
document.querySelector('#file_list').appendChild(vDom);
//reSort();
}
//清空列表
document.querySelector('#topbar .removeall').addEventListener('click',()=>{
axupimgs.res=[]
document.querySelectorAll('#file_list li').forEach((el,i)=>{
el.parentNode.removeChild(el)
});
});
//拖拽添加
document.addEventListener('dragover', (e)=>{
e.stopPropagation();
e.preventDefault();
e.dataTransfer.dropEffect = 'copy';
});
document.addEventListener('drop', (e)=>{
e.stopPropagation();
e.preventDefault();
if(!e.dataTransfer.files){return false;}
var dropfiles = e.dataTransfer.files;
if(!(dropfiles.length>0)){return false;}
var exts=axupimgs.axupimgs_filetype.replace(/(\s)+/g,'').toLowerCase().split(',');
var files=[];
for( let file of dropfiles ){
ext = file.name.split('.');
ext = '.'+ext[ext.length-1];
for(let s of exts){
if(s==ext){
files.push(file);
break;
}
}
}
if(files.length>0){ addList(files) }
});
//添加文件
document.querySelector('#topbar .addfile').addEventListener('click',()=>{
var input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('multiple', 'multiple');
input.setAttribute('accept', axupimgs.axupimgs_filetype);
input.click();
input.onchange = function() {
var files = this.files;
addList(files);
document.querySelector('#topbar .upall').click();
}
});
var file_i = 0;
function upAllFiles(n){
var len = axupimgs.res.length;
file_i = n;
if(len == n){
file_i=0;
document.querySelector('#topbar .upall').innerText='全部上传';
return true;
}
if( axupimgs.res[n].url!='' ){
n++;
upAllFiles(n)
}else{
blobInfo.file=axupimgs.res[n].file;
upload_handler(blobInfo,function(url){
if(upload_base_path){
if(upload_base_path.slice(-1)=='/' && url.substr(0,1)=='/' ){
url = upload_base_path + url.slice(1);
}else if(upload_base_path.slice(-1)!='/' && url.substr(0,1)!='/' ){
url = upload_base_path + '/' + url;
}else{
url = upload_base_path + url;
}
OpenWBS 企业建站CMS系统(手机+PC+微信) v5.9.0.rar
需积分: 5 53 浏览量
2024-04-05
20:38:14
上传
评论
收藏 10.49MB RAR 举报
OpenWBS 企业建站CMS系统(手机+PC+微信) v5.9.0.rar （957个子文件） 
ow.region.data.asp 211KB ow.os.class.asp 189KB ow.admin.class.asp 172KB ow.setting.class.asp 172KB setup.db.data.asp 171KB ow.pinyin.lib.asp 143KB ow.content.class.asp 135KB ow.asp 128KB ow.member.class.asp 125KB ow.tpl.class.asp 114KB ow.admin.com.asp 103KB setup.db.table.asp 101KB ow.class.asp 92KB ow.category.class.asp 68KB ow.admin_group.class.asp 56KB ow.form.class.asp 55KB ow.uploads.class.asp 55KB ow.navigator.class.asp 47KB index.asp 45KB ow.member_group.class.asp 38KB ow.member_special_group.class.asp 35KB ow.form_field.class.asp 34KB ow.ad.class.asp 33KB ow.cache.class.asp 31KB ow.ajax.member.asp 30KB ow.model_field.class.asp 30KB ow.region.class.asp 28KB ow.model.class.asp 27KB ow.system_msg.class.asp 27KB ow.ucenter.asp 25KB ow.member_address.class.asp 25KB ow.verifycode.asp 22KB ow.client.asp 22KB ow.label.class.asp 22KB ow.tags.class.asp 21KB ow.mail_tpl.class.asp 21KB ow.position.class.asp 21KB ow.upload.lib.asp 21KB ow.content_type_attr.class.asp 21KB os.lang.asp 20KB ow.form_data.class.asp 20KB ow.content_type.class.asp 19KB ow.weixin_config.class.asp 19KB ow.search_keywords.class.asp 18KB ow.decore.asp 18KB ow.static.class.asp 18KB ow.admin.class.asp 18KB ow.position_data.class.asp 18KB ow.content_type_cate.class.asp 16KB ow.links.class.asp 16KB ow.content_comment.class.asp 16KB ow.ajax.main.asp 16KB ow.service_online.class.asp 16KB ow.sitemap.class.asp 15KB index.asp 15KB uc.lang.asp 15KB setting.class.asp 15KB ow.system_check.class.asp 14KB ow.keywords.class.asp 14KB setting.class.asp 14KB regboot.asp 13KB ow.member_deposit_log.class.asp 13KB ow.backup.class.asp 11KB ow.member_point_log.class.asp 11KB ow.smslog.class.asp 11KB index.asp 10KB ow.admin.bootstrap.asp 9KB index.class.asp 8KB index.class.asp 7KB ow.system_error.class.asp 7KB ow.system_log.class.asp 7KB ow.encore.asp 7KB system_msg.class.asp 6KB ow.cate.data.asp 6KB ow.uploads_log.class.asp 6KB system_msg.class.asp 6KB password.class.asp 5KB password.class.asp 5KB callback.asp 5KB point.class.asp 5KB ueditor.config.asp 5KB form.class.asp 5KB index.asp 5KB form.class.asp 4KB ow.os.asp 4KB ow.tpl.asp 4KB ow.ajax.form.asp 4KB point.class.asp 3KB ow.upload.iframe.asp 3KB ow.version.asp 3KB ow.image.upload.asp 3KB ow.jsconfig.asp 3KB ow.image.wxqrcode.upload.asp 3KB api.os.class.asp 2KB ow.sms.asp 2KB index.asp 2KB share.asp 2KB ow.upload.asp 2KB ow.config.asp 1KB admin.lang.asp 952B共 957 条
- 1
- 2
- 3
- 4
- 5
- 6
- 10
资源评论
