Question

我想使用FileUpload预览我在相同页面上拍摄的3张图像。我还要显示每3张图像的3个缩略图。但问题是它显示第一张图像9次，即3 * 3。我为它创建了图像文件夹。我运行的代码是：字符串文件，thumbPath;

    file = FileUpload1.PostedFile.FileName;
    thumbPath = ("~/images" + "/" + file);
    FileUpload1.SaveAs(Server.MapPath("images/") + file);
    Image1.ImageUrl = thumbPath;
    Image2.ImageUrl = thumbPath;
    Image3.ImageUrl = thumbPath;

    file = FileUpload2.PostedFile.FileName;
    thumbPath = ("~/images" + "/" + file);
    FileUpload1.SaveAs(Server.MapPath("images/") + file);
    Image4.ImageUrl = thumbPath;
    Image5.ImageUrl = thumbPath;
    Image6.ImageUrl = thumbPath;

    file = FileUpload3.PostedFile.FileName;
    thumbPath = ("~/images" + "/" + file);
    FileUpload1.SaveAs(Server.MapPath("images/") + file);
    Image7.ImageUrl = thumbPath;
    Image8.ImageUrl = thumbPath;
    Image9.ImageUrl = thumbPath;

Answer 1

你似乎每次都要保存第一张图片，所以你到处都能看到这张图片是有道理的。在您的代码中，同一行出现3次：

FileUpload1.SaveAs(Server.MapPath("images/") + file);

您可能希望更改FileUpload1，以便在代码的第二和第三部分中使用FileUpload2和FileUpload3。

FileUpload1.SaveAs(Server.MapPath("images/") + file);
// do something
FileUpload2.SaveAs(Server.MapPath("images/") + file);
// do something
FileUpload3.SaveAs(Server.MapPath("images/") + file);
// do something

此外，似乎用户选择上传多个同名文件，您将覆盖其中一些文件。你应该使用一些独特的文件名（也许是windows tempfiles）。请勿使用用户上传的文件的名称，或至少不使用此特定任务的文件名称。

Answer 2

此行代码中的问题

       FileUpload1.SaveAs(Server.MapPath("images/") + file);

试试这个

       string  file = FileUpload1.PostedFile.FileName;
       string thumbPath = ("~/images" + "/" + file);            
       FileUpload1.SaveAs(Server.MapPath("~/images/"+ file) );
       Image1.ImageUrl = thumbPath;

Answer 3

尝试以下单个图像的代码，您也可以为多个图像更改它：

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>Untitled Page</title>

    <style type="text/css">

        #newPreview 
        { 
            filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);

        } 
    </style> 


    <script language="javascript" type="text/javascript">

    function PreviewImg(imgFile) 
    { 
        var newPreview = document.getElementById("newPreview"); 
        newPreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgFile.value;

        newPreview.style.width = "80px"; 
        newPreview.style.height = "60px"; 
    } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server">

    <div> 
        preview 
        <asp:FileUpload ID="Fud_Pic" runat="server"
 onchange="PreviewImg(this)" />

        <div id="newPreview">

        </div> 
    </div> 
    </form> 
</body> 
</html>

使用fileupload预览图像

3 个答案: