Question

在上传之前，如何使用jQuery验证宽度和高度

<form id="form1" runat="server">
    <asp:FileUpload id="FileUploadControl" runat="server" />
    <asp:Button runat="server" id="UploadButton" text="Upload" onclick="UploadButton_Click" />
    <br /><br />
    <asp:Label runat="server" id="StatusLabel" text="Upload status: " />
</form>

Answer 1

您可以使用jquery uploadify插件。

以下是我对asp.net的示例代码

<script type="text/javascript">
   // <![CDATA[
   var id = "55";
   var theString = "asdf";
   $(document).ready(function() {
   $('#fileInput').uploadify({
   'uploader': 'uploadify/uploadify.swf',
   'script': 'Upload.ashx',
   'scriptData': { 'id': id, 'foo': theString},
   'cancelImg': 'uploadify/cancel.png',
   'auto': true,
   'multi': true,
   'fileDesc': 'Image Files',
   'fileExt': '*.jpg;*.png;*.gif;*.bmp;*.jpeg',
   'queueSizeLimit': 90,
   'sizeLimit': 4000000,
   'buttonText': 'Choose Images',
   'folder': '/uploads',
   'onAllComplete': function(event, queueID, fileObj, response, data) {

   }
 });

}）;

然后你想制作一个处理程序（.ashx）：

public class Upload : IHttpHandler, IRequiresSessionState
{

    public void ProcessRequest(HttpContext context)
    {
        try
        {
            HttpPostedFile file= context.Request.Files["Filedata"];

            int id = (Int32.Parse(context.Request["id"]));
            string foo = context.Request["foo"];
            file.SaveAs("C:\\" + id.ToString() + foo + file.FileName);

            context.Response.Write("1");
        }
        catch(Exception ex)
        {
            context.Response.Write("0");
        }
    }
}

Answer 2

在客户端无法验证要上传的图像的宽度和高度。

然而，在上传后，你可以获得图像的宽度和高度：

var height = $("#Image").height()
var width = $("#Image").width()

Answer 3

你可以这样试试：

private void ButtonUpload_Click(object sender, System.EventArgs e)  {

    //Determine type and filename of uploaded image
    string UploadedImageType = UploadedPicture.PostedFile.ContentType.ToString().ToLower();
    string UploadedImageFileName = UploadedPicture.PostedFile.FileName;

    //Create an image object from the uploaded file
    System.Drawing.Image UploadedImage = System.Drawing.Image.FromStream(UploadedPicture.PostedFile.InputStream);

    //Determine width and height of uploaded image
    float UploadedImageWidth = UploadedImage.PhysicalDimension.Width;
    float UploadedImageHeight = UploadedImage.PhysicalDimension.Height;

    //Check that image does not exceed maximum dimension settings
    if (UploadedImageWidth > 600 || UploadedImageHeight > 400) {
            Response.Write("This image is too big - please resize it!");
    }

}

（或）您可以尝试使用此uploader，您可以在用户上传之前确定常用的宽度和高度，这些内容适用于Chrome，Firefox和IE

Answer 4

服务器端（C＃）;

using (System.Drawing.Image myImage = System.Drawing.Image.FromStream(FileUploadJcrop.PostedFile.InputStream))
{
    if (myImage.Width > 500)
    {
        Double d = (myImage.Height * 500) / myImage.Width;
        Int32 myH = (Int32)Math.Round(d, 0);
        Bitmap src = Bitmap.FromStream(FileUploadJcrop.PostedFile.InputStream) as Bitmap;
        Bitmap result = new Bitmap(500, myH);
        using (Graphics myg = Graphics.FromImage((System.Drawing.Image)result))
        {
            myg.DrawImage(src, 0, 0, 500, myH);
        }
        result.Save(savePath);
        FileSaved = true;
    }
}

jQuery图片上传，如何在上传前验证图片尺寸

4 个答案: