动态修改layui上传组件的url进行文件上传

效果图：

html (代码中的th:text=#{xxx}是因为我使用了国际化，直接删除这段即可):

<div class="layui-form layui-form-pane" lay-filter="exceptionForm" >
	<input id="rno" name="rno" th:value="${qualityException.rno}" />
    <div class="layui-upload">
		<button type="button" class="layui-btn layui-btn-primary layui-border-blue" id="testList"><i class="layui-icon layui-icon-file" th:text="#{DragOrSelectFile}">拖拽或选择文件</i>  </button>
		<div class="layui-upload-list" style="max-width: 1280px;height: auto;" id="uploadDocument">
			<table class="layui-table">
				<thead>
					<tr>
						<th th:text="#{FILES}">文件名</th>
						<th th:text="#{size}">大小</th>
						<th th:text="#{select_state}">状态</th>
						<th th:text="#{progress}">进度</th>
						<th th:text="#{operation}">操作</th>
					</tr>
				</thead>
				<tbody id="demoList">
					<tr th:if="${qualityException.files}" th:each="file:${qualityException.files}">
						<td>
							<a style="color:#74afdb" href="javascript:;"
							   th:onclick="pdfDownloadOrInlineRead([[${qualityException.rno}]], [[${file.fileName}]], 'inlineRead' )"
							   th:text="${file.fileName}" th:attr="title=#{preview}">
							</a>
						</td>
						<td th:text="${file.size/1024}+'kb'"></td>
						<td colspan="2" th:attr="title=#{download}" style="text-align: center;">
							<a style="color:#74afdb" href="javascript:;"
							   th:onclick="pdfDownloadOrInlineRead([[${qualityException.rno}]], [[${file.fileName}]], 'down')">
								<i class="layui-icon layui-icon-download-circle" style="color:red"></i>
							</a>
						</td>
						<td style="cursor: pointer;color:red;text-align: center;" th:attr="title=#{BUTTON_DELETE}" th:onclick="delUpload(this, [[${qualityException.rno}]]);"> ╳ </td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
	<hr class="layui-bg-blue"/>
</div>

  //多文件上传
	  var uploadListIns = upload.render({
	     elem: '#testList'     // 选择文件按钮
	    ,elemList: $('#demoList') //列表元素对象
	    //,url: '/qualityExceptionDocumentUpload?rno=' + encodeURIComponent(form.val("exceptionForm")['rno'])  //此处使用$('#rno').value才能拿到值，不太懂为什么$('#rno').val()反而拿不到
	    ,accept: 'file'  //指定允许上传时校验的文件类型，可选值有：images（图片）、file（所有文件）、video（视频）、audio（音频）
	    ,exts: 'pdf' //只允许上传pdf  -- 'zip|rar|7z' 只允许上传压缩文件
	    ,size: 20 * 1024 * 1024 //限制文件大小，单位 KB ==20m
	    ,multiple: true  //是否允许多文件上传。设置 true即可开启。不支持ie8/9
	    ,number: 5   //设置同时可上传的文件数量，一般配合 multiple 参数出现; 0 不限制

	    /*,auto: false  //是否选完文件后自动上传。如果设定 false，那么需要设置 bindAction 参数来指向一个其它按钮提交上传
	    ,bindAction: '#testListAction'  //指向一个按钮触发上传，一般配合 auto: false 来使用
	    */
		 ,before: function(obj){ //obj参数包含的信息，跟 choose回调完全一致，上传前的回调。
			//因为url有参数需要根据实际填写的进行上传，因此一开始定义了及时表单中数据更新了，url还是之前的，因此需要动态修改
			var exceptionForm = form.val("exceptionForm"); //获取当前表单所有值
			var rn = form.val("exceptionForm")['rno']; //获取表单中name为rno这个元素的值
			this.url = '/qualityExceptionDocumentUpload?rno=' + encodeURIComponent(rn);
		}

	    ,choose: function(obj){   //选择文件后的回调函数。返回一个object参数
			var that = this;
			var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列

			  //读取本地文件
			obj.preview(function(index, file, result){
				var tr = $(['<tr id="upload-'+ index +'">'
					  ,'<td>'+ file.name +'</td>'
					  ,'<td>'+ (file.size/1014).toFixed(1) +'kb</td>'
					  ,'<td th:text=#{WaitingForUpload}>等待上传</td>'
					  ,'<td><div class="layui-progress" lay-filter="progress-demo-'+ index +'"><div class="layui-progress-bar" lay-percent=""></div></div></td>'
					  ,'<td>'
					  ,'<span class="demo-delete" th:attr="title=#{BUTTON_DELETE}" style="cursor: pointer;color:red;text-align: center;">╳</span>'
					  ,'</td>'
					  ,'</tr>'].join(''));
				//删除
				tr.find('.demo-delete').on('click', function(){
					  //debugger;
					  //console.log(files[index]);
					  //var fileName = files[index].name; 只能拿到待上传列表的数据，当上传成功后就不再存在files中，只存在table中，所以需要使用下面这句
					  var fileName = tr.children().eq(0).text();
					  var uploadStatus = tr.children().eq(2).text(); //获取上传状态
					  if(uploadStatus == '上传成功'){ //只有上传成功的才去删除服务器文件
						   $.post('/delQualityExceptionFile?rno=' + rno + '&fileName=' + fileName,  function(res) {
								if(res.code==0){
									  delete files[index]; //删除对应的文件
									  tr.remove();
									  uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
									 layer.msg([[#{Uploaded_file_del_successfully}]], {icon: 1, time: 2000});
								}else{
									layer.msg(res.msg, {icon: 5});
								}
						   })
					  }else{ //上传异常的或还未上传的只清空列表，不操作服务器，否则可能出现重复上传时把被重复文件都给删除了
					  		delete files[index]; //删除对应的文件
							tr.remove();
							uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
					  }
				});
				that.elemList.append(tr);
				element.render('progress'); //渲染新加的进度条组件
			});
	    }
	    ,done: function(res, index, upload){ //成功的回调
			  var that = this;
			  var tr = that.elemList.find('tr#upload-'+ index) ,tds = tr.children();
			  if(res.code == 0){ //上传成功
					tds.eq(2).html('<span style="color:green;" th-text="#{Upload_succeeded}">上传成功</span>') //显示上传成功
					tds.eq(3).html(''); //清空操作
					delete this.files[index]; //删除文件队列已经上传成功的文件
					return;
			  }else{
			  	tds.eq(2).html('<span style="color:red;" th-text="#{Upload_error}">上传失败</span>') //显示上传成功
			  	tds.eq(3).html(''); //清空操作
				layer.msg(res.msg, {icon: 5, time:3000});
			  }
	    }
	    ,progress: function(n, elem, e, index){ //注意：index 参数为 layui 2.6.6 新增
	      	element.progress('progress-demo-'+ index, n + '%'); //执行进度条。n 即为返回的进度百分比
	    }
	  });