我正在尝试添加拖放功能,以将文件加载到使用C#在VS 2013中作为类库项目创建的Web应用程序中。该Web应用程序使用母版页Site.Master和应用程序页CaptionProWeb.aspx。使用Nuget添加Dropzone之后,我发现一些脚本文件已添加到项目中,如下所示:
为激活Dropzone,我添加了对dropzone.js和dropzone.css脚本的引用,如下所示,并向标签添加了一个class =“ dropzone”元素,如下所示,如Site.Master标记所示,如下所示
<body>
<script src="dropzone/dropzone.js"></script>
<link href="dropzone/dropzone.css" rel="stylesheet" />
<form runat="server" class="dropzone" >
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="False">
<Scripts>
<asp:ScriptReference Name="MsAjaxBundle" />
<asp:ScriptReference Name="jquery" />
<asp:ScriptReference Name="jquery.ui.combined" />
<asp:ScriptReference Name="WebForms.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebForms.js"
</Scripts>
</asp:ScriptManager>
<div id="body">
<asp:ContentPlaceHolder runat="server" ID="FeaturedContent" >
</asp:ContentPlaceHolder>
<section class="content-wrapper main-content clear-fix">
<asp:ContentPlaceHolder runat="server" ID="MainContent" >
</asp:ContentPlaceHolder>
</section>
</div>
</form>
</body>
我的理解是,这将激活CaptionProWeb.aspx的MainContent区域上的拖放,该区域包含以下代码:
<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">
<script> ..various scripts.. </script>
<table __designer:mapid="53" style="width: 54%; height: 462px; margin: 0px; padding: 0px; border-collapse: collapse;">
<tr __designer:mapid="54">
<td __designer:mapid="56" class="auto-style7">
<div id="dZUpload" style="width: 509px; height: 355px; margin-left: 0px; margin-right: 0px;">
<asp:Image ID="Image1" runat="server" Height="355px" style="margin-left: 0px; margin-right: 0px;" Width="509px" />
</div>
</td>
</tr>
我发现,当将JPEG文件从资源管理器拖到CaptionProWeb上时,光标图标被文件的缩略图和单词“ Move”所代替。如果在VS IDE中单击绿色的运行箭头后,然后如Firefox中所示将文件拖放到CaptionProWeb上,则单词Move仍然存在,如果我将其拖放,浏览器会显示该文件。使用Chrome,当我将鼠标移到CaptionProWeb上时,“移动”一词将被“复制”替换,但是拖放的效果与Firefox相同。当我构建从https://github.com/iSatinderSingh/Final_dropzoneJs_Aspnet下载的VS演示解决方案时,发现拖放功能可以正常工作,但该项目似乎是网站而不是类库。当光标悬停在加载的表单上时,拖动文件时出现的“移动”字将被“复制”替换。这是拖放对我不起作用的原因吗?