Question

我遇到了jquery.filedrop.js插件的问题。

它在这个项目的VS2012版本中有效，所以我不确定为什么在我的新VS2015版本的项目中出现了原因。

该应用程序最初是在VS2012的Asp.Net MVC 5中开发的。然后我将它移植到VS2015，没有任何问题，并继续进一步开发。

当我在放置区拖放cvs文件时，在jquery.filedrop.js插件中发生异常（另见下面的屏幕截图）：

xhr.sendAsBinary() exception

在Upload.cshtml中，我有这个js和html代码：

＆＃13;

$(".dropzone").filedrop({
	url: "@Url.Action("_UploadMultiple", "Portfolio")",
	paramname: "files",
	maxFiles: 10,
	maxfilesize: 10, // max file size in MB
	allowedfiletypes: [], // ["text/plain", "text/csv", "application/csv", "text/xml", "application/xml"] // Filetypes allowed by Content-Type, empty array means no restrictions
	allowedfileextensions: [".csv", ".xml"],
	dragOver: function () {
		$(".dropzone").css("background", "#eee");
	},
	dragLeave: function () {
		$(".dropzone").css("background", "#fff");
	},
	drop: function () {
		$(".dropzone").css("background", "#eee");
		// Add spinner
		$(".dropzone > p").html("<i class='fa fa-2x fa-refresh fa-spin'></i><br /><strong>Processing</strong>");
		
	},
	afterAll: function () {
		Alert.windowOk("Completed", "All files were processed. Please check the output for details.", "success",
			function () {
				$(".dropzone").css("background", "#fff");
				// Remove spinner
				$(".dropzone > p").html("<i class='fa fa-2x fa-arrow-up'></i><br /><strong>Drop CSV or XML files here to upload</strong>");
			}
		);
	},
	uploadFinished: function (i, file, response, time) {
		UP.updateResults(response);
	},
	error: function (err, file) {
		switch (err) {
			default:
				break;
		}
		$(".dropzone").css("background", "#fff");
		// Remove spinner
		$(".dropzone > p").html("<i class='fa fa-2x fa-arrow-up'></i><br /><strong>Drop CSV or XML files here to upload</strong>");
	}
});

＆＃13;

@{
    ViewBag.Title = "Upload";
    ViewBag.Breadcrumb = "Upload";
}

@section styles {
  /* styles are here...*/
}

<form id="upload-form" action="@Url.Action("_Upload", "Portfolio")" method="POST" enctype="multipart/form-data">
@Html.AntiForgeryToken()
<div class="row">	
	<div class="col-md-2 dropzone" style="margin-top:10px;">
		<p class="text-center" style="margin-top:10px;">
			<i class="fa fa-2x fa-arrow-up"></i>
			<br />
			<strong>Drop CSV or XML files here to upload</strong>
		</p>
	</div>
</div>
</form>

@section scripts {
    <script src="@Url.Content("~/Scripts/jquery.filedrop.js")" type="text/javascript"></script>

＆＃13;

我的jquery版本是：jQuery JavaScript Library v1.10.2，它与具有工作filedrop版本的原始项目相同。

jquery.filedrop.js从https://github.com/weixiyen/jquery-filedrop下载Version: 0.1.0

在此屏幕截图中，我会在异常发生后显示它的样子并且处理微调器仍保持动画。

我想知道我是否在某处发生了jquery冲突，以及是否有人可以提供一些指导如何解决此异常。

谢谢你，鲍勃

Answer 1

我将冲突追溯到pace.js，由inspinia.js设计模板使用（我从wrapbootstrap.com获得了inspinia模板）。

在pace.min.js中评论BundleConfig.cs消除了冲突。

现在要弄清楚他们的步伐如何.js和fileupload可以并排生活......

bundles.Add(new ScriptBundle("~/bundles/plugins").Include(
                      "~/Scripts/plugins/metisMenu/metisMenu.min.js",
                      //"~/Scripts/plugins/pace/pace.min.js",
                      "~/Scripts/plugins/inspinia/inspinia.js",
                      "~/Scripts/plugins/inspinia/skin.config.min.js"));

在Chrome调试窗口中查看jquery.filedrop.js。当我将鼠标悬停在pace.min对象上时，您可以看到XMLHttpRequest参考。

Chrome中的jquery fileupload插件问题

1 个答案: