使用jQuery实现验证上传图片的格式与大小

要使用jQuery实现验证上传图片的格式与大小，可以按照以下步骤进行：

1. HTML代码

首先，在HTML代码中定义一个文件上传表单，例如：

<form id="uploadForm">
  <input type="file" name="file" id="file">
  <input type="submit" value="上传">
</form>

2. jQuery代码

使用jQuery来验证上传的图片格式和大小。下面是一个示例代码：

$(document).ready(function() {
  // 对文件上传表单进行监听
  $("#uploadForm").submit(function() {
    // 取得上传的文件
    var file = $("#file").get(0).files[0];
    // 验证文件格式
    if(!/\.(gif|jpg|jpeg|png)$/i.test(file.name)) {
      // 如果文件格式不符合要求，给出提示
      alert("只允许上传gif、jpg、jpeg、png格式的图片！");
      return false;
    }
    // 验证文件大小
    if(file.size > 2048000) {
      // 如果文件大小超过2MB，给出提示
      alert("请上传小于2MB的图片！");
      return false;
    }
    // 如果文件格式和大小都合法，允许上传
    return true;
  });
});

这段代码使用jQuery对文件上传表单进行了监听，在提交表单时，通过get(0)方法获取到文件上传组件，然后判断上传的文件格式是否符合要求，如果不符合则弹出提示框，阻止表单提交并返回false；如果符合要求，则继续验证文件大小是否超过2MB，如果超过则弹出提示框，阻止表单提交并返回false；如果文件格式和大小都合法，则允许提交表单，返回true。

示例说明

示例1：验证上传图片格式

当用户选择一个pdf格式的文件，上传表单将会弹出一个提示框，提示信息为“只允许上传gif、jpg、jpeg、png格式的图片！”，并且表单不会提交。

示例2：验证上传图片大小

当用户选择一张大小超过2MB的图片，上传表单将会弹出一个提示框，提示信息为“请上传小于2MB的图片！”，并且表单不会提交。