liwantao
/
shuquAi


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
							<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<title>上传文件</title>
		<style>
			* {
				margin: 0;
				padding: 0;
			}

			.head-btn {
				margin: 24px;
				text-align: center;
			}

			.file {
				position: relative;
				display: inline-block;
				border: 1px solid #99D3F5;
				border-radius: 10px;
				padding: 12px 24px;
				overflow: hidden;
				background-color: #1975F7;
				color: #fff;
				text-decoration: none;
				text-indent: 0;
				line-height: 20px;
				font-size: 20px;
			}

			.file input {
				position: absolute;
				font-size: 20px;
				right: 0;
				top: 0;
				opacity: 0;
			}

			/* .file:hover {
            background: #AADFFD;
            border-color: #78C3F3;
            color: #004974;
            text-decoration: none;
        } */
			.determine {
				color: #FFFFFF;
				background-color: #007AFF;
				display: inline-block;
				font-size: 20px;
				border-radius: 5px;
				padding: 8px 24px;
			}

			.showFileName {
				display: inline-block;
				height: 30px;
				min-width: 300px;
			}
		</style>
	</head>
	<body>
		<div class="head-btn">
			<form action="" method="post">
				<a href="javascript:;" class="file" id="selectFile">选择文件
					<input type="file" name="uploadFile" id="uploadFile">
				</a>
			</form>
			<p class="showFileName"></p>
		</div>

		<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
		<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js">
		</script>
		<script>
			function getQuery(name) { // 获取uni传值
			    // 正则：[找寻'&' + 'url参数名字' = '值' + '&']（'&'可以不存在）
			    // let reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
				console.log(window.location.search)
				// let r;
				// // #ifdef H5
			 //    r = window.location.search.substr(1).match(reg);
				// // #endif
				// // #ifdef APP-PLUS
				// r = window.location.search;
				// // #endif
			 //    if(r != null) {
			 //        // 对参数值进行解码
			 //        return unescape(r[2]);
			 //    }
			 //    return null;
			}
			// console.log(44456,getQuery('token')); // 调用获取参数
			$(".file").on("change", "input[type='file']", function() {
				let filePath = $(this).val();
				// console.log(333, filePath)
				// console.log(4444, document.getElementById('uploadFile').files[0])
				console.log(5555,document.getElementById('uploadFile'))
				var receiver = document.getElementById('uploadFile')
				let files = document.getElementById('uploadFile').files[0];
				uni.postMessage({
					data: {
						files: files
					}
				})
				receiver.postMessage("hello there!","*")
				localStorage.setItem("fileAddress", filePath);
				let lastname = localStorage.getItem("fileAddress");
				if (lastname != "") {
					$(".showFileName").html(lastname);
				} else {
					$(".showFileName").html("");
				}
			});
		</script>
	</body>
</html>