我没有构建我们网站的这一部分，但因为其他开发人员被引入另一个项目，我的工作是解决这个问题。基本上我们使用基本的蓝色imp文件上传器插件通过ajax提交文件。当我第一次选择一个文件并上传它时一切正常。当我选择一个新文件并上传它时，它会提交两次。一个是第一个文件，另一个是第二个文件。如果我之后选择一个新文件，它将提交3次，等等。如果我丢弃文件而不是上传文件，也会发生同样的事情。我不能，因为我的生活弄清楚是什么触发了它多次运行而且我没有在线帮助。
<section class="add-document editable">
<form id="add-new-doc" enctype="multipart/form-data" action="" data-project="projectid" class="document-upload">
<div class="hidden">
<div class="row">
<div class="col-xs-12">
<h3 class="editcue">Add a new document</h3>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-4">
<label for="item-title">Document Title</label>
</div>
<div class="col-xs-12 col-sm-8">
<input type="text" name="item-title" placeholder="Title" value="" data-type="">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-4">
<label for="file">Related Document</label>
</div>
<div class="col-xs-12 col-sm-8">
<div class="upload-button"><span class="alt">Selected file: Individual_Check_Stub2015_11_13_04_15_25_218.PDF</span>
<input type="file" id="fileupload" name="file" accept=".doc,.docx,.pdf,.txt,.jpg,.png,.xls,.xlsx,.csv,.ppt,.zip" data-url="">
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-4">
<label for="expr-or-issue-date">Date (optional)</label>
</div>
<div class="col-xs-12 col-sm-8">
<input type="date" name="expr-or-issue-date" value="" data-type="">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-4">
<label for="restrict-to-subsidiary">Restrict this document (optional)</label>
</div>
<div class="col-xs-12 col-sm-8">
<!-- multi-select filterable select-->
<select data-placeholder="Choose a Subsidiary" name="restrict-to-subsidiary" multiple="" data-url="../_res/js/json/subsidiary-doc.json" class="select-restrict select2-hidden-accessible" tabindex="-1" aria-hidden="true"><option value="itemid-001" title="itemid-001">Appleton Corporation</option><option value="itemid-003" title="itemid-003">Daniel O'Connell's Sons</option></select><span class="select2 select2-container select2-container--default" dir="ltr" style="width: 503px;"><span class="selection"><span class="select2-selection select2-selection--multiple" role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-expanded="false" tabindex="-1"><ul class="select2-selection__rendered"><li class="select2-search select2-search--inline"><input class="select2-search__field" type="search" tabindex="0" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" role="textbox" placeholder="Choose a Subsidiary" style="width: 469px;"></li></ul></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span>
<!-- end multi-select-->
</div>
</div>
<!-- Edit Actions: Save or Cancel Edit Buttons-->
<div class="actions">
<div class="row">
<div class="col-xs-12 col-sm-4">
<div class="discarddoc"><span>Discard document</span></div>
</div>
<div class="col-xs-12 col-sm-4">
<div class="newdoc"><span>Upload document
<!-- End C-02--></span></div>
</div>
<div class="col-xs-12 col-sm-4"></div>
</div>
</div>
<!-- End edit actions-->
</div>
</form>
</section>
这是js
// upload documents on submit
function uploadThis(){
var $form = $('input[type=file]').closest('form'),
userid = $form.data('user'),
url = $form.attr('action'),
uploadButton = $form.find('.new-doc span');
$('input[type=file]').fileupload({
url: url,
multipart: true,
singleFileUploads: true,
add: function (e, data) {
data.context = $form.find('.newdoc').click(function () {
console.log($(this));
data.submit();
return false;
});
},
change: function (e, data){
if($(this).attr('id') === "image-input"){}
else{
var thisform = $(this).closest('form');
$.each(data.files, function(index,file){
data.context = thisform.find('.upload-button span').text('Selected file: ' + file.name);
});
}
},
done: function (e, data) {
var thisform = $(this).closest('form');
data.context = thisform.find(".upload-button input").find(".files").empty();
$(this).wrap('<form>').closest('form').get(0).reset();
$(this).unwrap();
},
stop: function(e, data) {
},
failed: function (e, data) {
data.context.text('Unable to upload document.');
}
});
}
// document uploads
$('.document-upload').each(function(){
var userid = $(this).data('user');
//some code retracted to keep it simpler
uploadThis();
});
// end document uploads
// discard doc
$('#add-new-doc .discarddoc').on('click', function(e){
e.preventDefault();
var $this = $(this),
$form = $(this).closest('form');
$form[0].reset();
$form
.find('.upload-button span')
.text('Select Document');
});
很抱歉格式化我试图尽可能地修复它。任何见解都会令人惊叹。谢谢