diff --git a/src/com/yj/bean/Book.java b/src/com/yj/bean/Book.java index 30432c7..3f6e5c6 100644 --- a/src/com/yj/bean/Book.java +++ b/src/com/yj/bean/Book.java @@ -5,88 +5,176 @@ import java.math.BigDecimal; /** * @author yj * @create 2020-10-02 19:51 + * + * Book类表示一本书的信息，包含了书籍的基本属性，如ID、书名、作者、价格、销量、库存、分类和图片路径等。 */ public class Book { - private Integer id;//id - private String name;//姓名 - private String author;//作者 + + // 书籍的唯一标识符 + private Integer id; + + // 书籍的名称 + private String name; + + // 书籍的作者 + private String author; + + // 书籍的价格，使用BigDecimal类型以确保精度 private BigDecimal price; + + // 书籍的销量 private Integer sales; + + // 书籍的库存数量 private Integer stock; + + // 书籍的分类 private String classification; - private String imgPath="static/img/default.jpg"; + // 书籍的图片路径，默认值为"static/img/default.jpg" + private String imgPath = "static/img/default.jpg"; + + /** + * 获取书籍的分类 + * @return 书籍的分类 + */ public String getClassification() { return classification; } + /** + * 设置书籍的分类 + * @param classification 书籍的分类 + */ public void setClassification(String classification) { this.classification = classification; } - - + /** + * 获取书籍的ID + * @return 书籍的ID + */ public Integer getId() { return id; } + /** + * 设置书籍的ID + * @param id 书籍的ID + */ public void setId(Integer id) { this.id = id; } + /** + * 获取书籍的名称 + * @return 书籍的名称 + */ public String getName() { return name; } + /** + * 设置书籍的名称 + * @param name 书籍的名称 + */ public void setName(String name) { this.name = name; } + /** + * 获取书籍的作者 + * @return 书籍的作者 + */ public String getAuthor() { return author; } + /** + * 设置书籍的作者 + * @param author 书籍的作者 + */ public void setAuthor(String author) { this.author = author; } + /** + * 获取书籍的价格 + * @return 书籍的价格 + */ public BigDecimal getPrice() { return price; } + /** + * 设置书籍的价格 + * @param price 书籍的价格 + */ public void setPrice(BigDecimal price) { this.price = price; } + /** + * 获取书籍的销量 + * @return 书籍的销量 + */ public Integer getSales() { return sales; } + /** + * 设置书籍的销量 + * @param sales 书籍的销量 + */ public void setSales(Integer sales) { this.sales = sales; } + /** + * 获取书籍的库存数量 + * 如果库存数量小于0，则返回0 + * @return 书籍的库存数量 + */ public Integer getStock() { - if(stock<0) stock=0;return stock; + if (stock < 0) stock = 0; + return stock; } + /** + * 设置书籍的库存数量 + * 如果库存数量小于0，则将其设置为0 + * @param stock 书籍的库存数量 + */ public void setStock(Integer stock) { - if(stock<0) stock=0; + if (stock < 0) stock = 0; this.stock = stock; } + /** + * 获取书籍的图片路径 + * @return 书籍的图片路径 + */ public String getImgPath() { return imgPath; } + /** + * 设置书籍的图片路径 + * 如果传入的图片路径为null或空字符串，则使用默认图片路径"static/img/default.jpg" + * @param imgPath 书籍的图片路径 + */ public void setImgPath(String imgPath) { - if(imgPath==null||"".equals(imgPath)) { + if (imgPath == null || "".equals(imgPath)) { this.imgPath = "static/img/default.jpg"; } else { this.imgPath = imgPath; } } + /** + * 重写toString方法，返回书籍的详细信息 + * @return 书籍的详细信息字符串 + */ @Override public String toString() { return "Book{" + @@ -101,9 +189,23 @@ public class Book { '}'; } + /** + * 无参构造方法 + */ public Book() { } + /** + * 全参构造方法 + * @param id 书籍的ID + * @param name 书籍的名称 + * @param author 书籍的作者 + * @param price 书籍的价格 + * @param sales 书籍的销量 + * @param stock 书籍的库存数量 + * @param classification 书籍的分类 + * @param imgPath 书籍的图片路径 + */ public Book(Integer id, String name, String author, BigDecimal price, Integer sales, Integer stock, String classification, String imgPath) { this.id = id; this.name = name; @@ -114,4 +216,4 @@ public class Book { this.classification = classification; this.imgPath = imgPath; } -} +} \ No newline at end of file diff --git a/src/com/yj/dao/BookDao.java b/src/com/yj/dao/BookDao.java index 48740be..65ba631 100644 --- a/src/com/yj/dao/BookDao.java +++ b/src/com/yj/dao/BookDao.java @@ -8,34 +8,108 @@ import java.util.List; /** * @author yj * @create 2020-08-23 21:08 + * + * BookDao接口定义了对书籍数据的操作方法，包括增删改查、分页查询、按价格范围查询、按名称或作者查询等功能。 */ public interface BookDao { + /** + * 添加一本书籍到数据库 + * @param book 要添加的书籍对象 + * @return 受影响的行数，成功返回1，失败返回0 + */ public int addBook(Book book); + /** + * 根据书籍ID删除书籍 + * @param id 要删除的书籍ID + * @return 受影响的行数，成功返回1，失败返回0 + */ public int deleteBookById(Integer id); + /** + * 更新书籍信息 + * @param book 包含更新信息的书籍对象 + * @return 受影响的行数，成功返回1，失败返回0 + */ public int updateBook(Book book); + /** + * 根据书籍ID查询书籍信息 + * @param id 要查询的书籍ID + * @return 查询到的书籍对象，如果未找到返回null + */ public Book queryBookById(Integer id); + /** + * 查询所有书籍信息 + * @return 包含所有书籍的列表 + */ public List queryBooks(); + /** + * 查询所有书籍的总记录数 + * @return 所有书籍的总记录数 + */ Integer queryForPageTotalCount(); + /** + * 分页查询书籍信息 + * @param begin 分页的起始索引 + * @param pageSize 每页显示的记录数 + * @return 当前页的书籍列表 + */ List queryForPageItems(int begin, int pageSize); + /** + * 根据价格范围查询书籍的总记录数 + * @param min 价格范围的最小值 + * @param max 价格范围的最大值 + * @return 符合价格范围的书籍总记录数 + */ Integer queryForPageTotalCountByPrice(int min, int max); + /** + * 根据价格范围分页查询书籍信息 + * @param begin 分页的起始索引 + * @param pageSize 每页显示的记录数 + * @param min 价格范围的最小值 + * @param max 价格范围的最大值 + * @return 当前页的书籍列表 + */ List queryForPageItemsByPrice(int begin, int pageSize, int min, int max); + /** + * 根据书籍名称或作者查询书籍的总记录数 + * @param nameorauthor 书籍名称或作者的关键字 + * @return 符合条件的书籍总记录数 + */ Integer queryForPageTotalCountByNameOrAuthor(String nameorauthor); + /** + * 根据书籍名称或作者分页查询书籍信息 + * @param begin 分页的起始索引 + * @param pageSize 每页显示的记录数 + * @param nameorauthor 书籍名称或作者的关键字 + * @return 当前页的书籍列表 + */ List queryForPageItemsByNameOrAuthor(int begin, int pageSize, String nameorauthor); + /** + * 查询所有书籍并按某种顺序排序（如销量、价格等） + * @return 按顺序排序的书籍列表 + */ List queryForPageItemsOrder(); + /** + * 查询所有书籍的总金额（价格总和） + * @return 所有书籍的总金额 + */ BigDecimal queryTotalMoney(); + /** + * 查询书籍的总数量 + * @return 书籍的总数量 + */ public Integer queryBooknums(); -} +} \ No newline at end of file diff --git a/src/com/yj/service/BookService.java b/src/com/yj/service/BookService.java index 94a4b80..3916727 100644 --- a/src/com/yj/service/BookService.java +++ b/src/com/yj/service/BookService.java @@ -9,28 +9,84 @@ import java.util.List; /** * @author yj * @create 2020-08-24 14:40 + * + * BookService接口定义了与书籍相关的业务逻辑操作，包括书籍的增删改查、分页查询、按价格范围查询、按名称或作者查询等功能。 */ public interface BookService { + /** + * 添加一本书籍 + * @param book 要添加的书籍对象 + */ public void addBook(Book book); + /** + * 更新书籍信息 + * @param book 包含更新信息的书籍对象 + */ public void updateBook(Book book); + /** + * 根据书籍ID删除书籍 + * @param id 要删除的书籍ID + */ public void deleteBookById(Integer id); + /** + * 根据书籍ID查询书籍信息 + * @param id 要查询的书籍ID + * @return 查询到的书籍对象，如果未找到返回null + */ public Book queryBookById(Integer id); + /** + * 查询所有书籍信息 + * @return 包含所有书籍的列表 + */ public List queryBooks(); + /** + * 分页查询书籍信息 + * @param pageNo 当前页码 + * @param pageSize 每页显示的记录数 + * @return 分页对象，包含当前页的书籍列表和分页信息 + */ Page page(int pageNo, int pageSize); + /** + * 根据价格范围分页查询书籍信息 + * @param pageNo 当前页码 + * @param pageSize 每页显示的记录数 + * @param min 价格范围的最小值 + * @param max 价格范围的最大值 + * @return 分页对象，包含当前页的书籍列表和分页信息 + */ Page pageByPrice(int pageNo, int pageSize, int min, int max); + /** + * 根据书籍名称或作者分页查询书籍信息 + * @param pageNo 当前页码 + * @param pageSize 每页显示的记录数 + * @param nameOrAuthor 书籍名称或作者的关键字 + * @return 分页对象，包含当前页的书籍列表和分页信息 + */ Page pageByNameOrAuthor(int pageNo, int pageSize, String nameOrAuthor); + /** + * 查询所有书籍并按某种顺序排序（如销量、价格等） + * @return 分页对象，包含按顺序排序的书籍列表和分页信息 + */ Page pageOrder(); + /** + * 查询书籍的总数量 + * @return 书籍的总数量 + */ public Integer queryTotalBooks(); + /** + * 查询所有书籍的总金额（价格总和） + * @return 所有书籍的总金额 + */ BigDecimal queryTotalMoney(); -} +} \ No newline at end of file diff --git a/src/com/yj/test/BookDaoTest.java b/src/com/yj/test/BookDaoTest.java index 19ca13d..dd64eda 100644 --- a/src/com/yj/test/BookDaoTest.java +++ b/src/com/yj/test/BookDaoTest.java @@ -10,59 +10,102 @@ import java.math.BigDecimal; /** * @author yj * @create 2020-08-24 11:01 + * + * BookDaoTest类用于测试BookDao接口的实现类BookDaoImpl中的各个方法。 + * 通过JUnit测试框架，验证数据库操作的正确性。 */ public class BookDaoTest { + + // 创建BookDao接口的实现类BookDaoImpl对象 BookDao bookDao = new BookDaoImpl(); + /** + * 测试添加书籍的方法 + */ @Test public void addBook() { - //`name`,`author`,`classification`,`price`,`sales`,`stock`,`img_path` - //Integer id, String name, String author, BigDecimal price, Integer sales, Integer stock, String classification, String imgPath) - bookDao.addBook(new Book(null,"舌的中国","yjjj",new BigDecimal("5"),100,23,"","")); + // 创建一个新的Book对象，并调用addBook方法将其添加到数据库中 + bookDao.addBook(new Book(null, "舌的中国", "yjjj", new BigDecimal("5"), 100, 23, "", "")); } + /** + * 测试删除书籍的方法 + */ @Test public void deleteBook() { + // 调用deleteBookById方法，删除ID为3的书籍 bookDao.deleteBookById(3); } + /** + * 测试根据ID查询书籍的方法 + */ @Test public void queryById() { + // 调用queryBookById方法，查询ID为64的书籍，并打印结果 System.out.println(bookDao.queryBookById(64)); } + /** + * 测试更新书籍信息的方法 + */ @Test public void update() { - bookDao.updateBook(new Book(35,"舌尖的中国","yj",new BigDecimal("5"),100,23,"文学","")); + // 创建一个新的Book对象，并调用updateBook方法更新ID为35的书籍信息 + bookDao.updateBook(new Book(35, "舌尖的中国", "yj", new BigDecimal("5"), 100, 23, "文学", "")); } + /** + * 测试查询所有书籍的方法 + */ @Test public void queryList() { + // 调用queryBooks方法，查询所有书籍，并打印结果 System.out.println(bookDao.queryBooks()); } + /** + * 测试查询书籍总记录数的方法 + */ @Test public void queryForPageTotalCount() { + // 调用queryForPageTotalCount方法，查询所有书籍的总记录数，并打印结果 System.out.println(bookDao.queryForPageTotalCount()); } + /** + * 测试分页查询书籍的方法 + */ @Test public void queryForPageItems() { - System.out.println(bookDao.queryForPageItems(1,4)); + // 调用queryForPageItems方法，分页查询书籍，并打印结果 + System.out.println(bookDao.queryForPageItems(1, 4)); } + /** + * 测试根据价格范围查询书籍总记录数的方法 + */ @Test public void queryForPageTotalCountByPrice() { - System.out.println(bookDao.queryForPageTotalCountByPrice(10,50)); + // 调用queryForPageTotalCountByPrice方法，查询价格在10到50之间的书籍总记录数，并打印结果 + System.out.println(bookDao.queryForPageTotalCountByPrice(10, 50)); } + /** + * 测试根据价格范围分页查询书籍的方法 + */ @Test public void queryForPageItemsByPrice() { - System.out.println(bookDao.queryForPageItemsByPrice(1,4,10,50)); + // 调用queryForPageItemsByPrice方法，根据价格范围分页查询书籍，并打印结果 + System.out.println(bookDao.queryForPageItemsByPrice(1, 4, 10, 50)); } + /** + * 测试查询书籍总数量的方法 + */ @Test public void queryBooknums() { + // 调用queryBooknums方法，查询书籍的总数量，并打印结果 System.out.println(bookDao.queryBooknums()); } -} +} \ No newline at end of file diff --git a/src/com/yj/test/BookServiceTest.java b/src/com/yj/test/BookServiceTest.java index f2358b1..8ffc3ee 100644 --- a/src/com/yj/test/BookServiceTest.java +++ b/src/com/yj/test/BookServiceTest.java @@ -12,43 +12,78 @@ import java.math.BigDecimal; /** * @author yj * @create 2020-08-24 14:57 + * + * BookServiceTest类用于测试BookService接口的实现类BookServiceImpl中的各个方法。 + * 通过JUnit测试框架，验证业务逻辑的正确性。 */ public class BookServiceTest { + // 创建BookDao接口的实现类BookDaoImpl对象 private BookDao bookDao = new BookDaoImpl(); + + // 创建BookService接口的实现类BookServiceImpl对象 private BookService bookService = new BookServiceImpl(); + + /** + * 测试添加书籍的方法 + */ @Test public void addBook() { - bookDao.addBook(new Book(null,"舌尖上的中国","yj",new BigDecimal("5"),100,23,"文学","")); + // 创建一个新的Book对象，并调用addBook方法将其添加到数据库中 + bookDao.addBook(new Book(null, "舌尖上的中国", "yj", new BigDecimal("5"), 100, 23, "文学", "")); } + /** + * 测试更新书籍信息的方法 + */ @Test public void updateBook() { - bookDao.updateBook(new Book(null,"舌尖上的中国","yj",new BigDecimal("5"),100,23,"文学","")); + // 创建一个新的Book对象，并调用updateBook方法更新书籍信息 + bookDao.updateBook(new Book(null, "舌尖上的中国", "yj", new BigDecimal("5"), 100, 23, "文学", "")); } + /** + * 测试根据ID删除书籍的方法 + */ @Test public void deleteBookById() { + // 调用deleteBookById方法，删除ID为25的书籍，并打印受影响的行数 System.out.println(bookDao.deleteBookById(25)); } + /** + * 测试根据ID查询书籍的方法 + */ @Test public void queryBookById() { + // 调用queryBookById方法，查询ID为23的书籍，并打印结果 System.out.println(bookDao.queryBookById(23)); } + /** + * 测试查询所有书籍的方法 + */ @Test public void queryBooks() { + // 调用queryBooks方法，查询所有书籍，并打印结果 System.out.println(bookDao.queryBooks()); } + /** + * 测试分页查询书籍总记录数的方法 + */ @Test public void page() { + // 调用queryForPageTotalCount方法，查询所有书籍的总记录数，并打印结果 System.out.println(bookDao.queryForPageTotalCount()); } + /** + * 测试查询所有书籍的总金额的方法 + */ @Test public void queryTotalMoney() { + // 调用queryTotalMoney方法，查询所有书籍的总金额，并打印结果 System.out.println(bookDao.queryTotalMoney()); } } \ No newline at end of file diff --git a/src/com/yj/web/BaseServlet.java b/src/com/yj/web/BaseServlet.java index 39a2021..1c5e289 100644 --- a/src/com/yj/web/BaseServlet.java +++ b/src/com/yj/web/BaseServlet.java @@ -10,26 +10,54 @@ import java.lang.reflect.Method; /** * @author yj * @create 2020-08-23 16:51 + * + * BaseServlet类是一个抽象的Servlet基类，用于简化Servlet的开发。 + * 它通过反射机制动态调用子类中的方法，避免了在每个Servlet中重复编写doGet和doPost方法。 */ public abstract class BaseServlet extends HttpServlet { + /** + * 处理GET请求，直接调用doPost方法 + * @param req HttpServletRequest对象 + * @param resp HttpServletResponse对象 + * @throws ServletException + * @throws IOException + */ @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { - doPost(req,resp); + doPost(req, resp); } + /** + * 处理POST请求，通过反射机制动态调用子类中的方法 + * @param req HttpServletRequest对象 + * @param resp HttpServletResponse对象 + * @throws ServletException + * @throws IOException + */ + @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { - //解决post请求中文乱码 + // 解决POST请求中文乱码问题 req.setCharacterEncoding("utf-8"); - //解决相应的中文乱码 + + // 解决响应的中文乱码问题 resp.setContentType("text/html;charset=UTF-8"); + + // 获取请求参数action，该参数用于指定要调用的方法名 String action = req.getParameter("action"); + try { - Method method = this.getClass().getDeclaredMethod(action, HttpServletRequest.class,HttpServletResponse.class); - method.invoke(this,req,resp); + // 通过反射获取当前类中指定名称的方法 + Method method = this.getClass().getDeclaredMethod(action, HttpServletRequest.class, HttpServletResponse.class); + + // 调用方法，传入请求和响应对象 + method.invoke(this, req, resp); } catch (Exception e) { + // 捕获异常并打印堆栈信息 e.printStackTrace(); + + // 将异常包装为运行时异常抛出，便于上层处理 throw new RuntimeException(e); } } -} +} \ No newline at end of file diff --git a/src/com/yj/web/BookServlet.java b/src/com/yj/web/BookServlet.java index 0688f86..b498d62 100644 --- a/src/com/yj/web/BookServlet.java +++ b/src/com/yj/web/BookServlet.java @@ -15,72 +15,137 @@ import java.util.List; /** * @author yj * @create 2020-08-24 15:25 + * + * BookServlet类继承自BaseServlet，用于处理与书籍相关的请求。 + * 通过调用BookService接口的实现类BookServiceImpl，完成书籍的增删改查、分页查询等操作。 */ public class BookServlet extends BaseServlet { + // 创建BookService接口的实现类BookServiceImpl对象 private BookService bookService = new BookServiceImpl(); + /** + * 处理添加书籍的请求 + * @param req HttpServletRequest对象 + * @param resp HttpServletResponse对象 + * @throws ServletException + * @throws IOException + */ protected void add(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { - int pageNo = WebUtils.parseInt(req.getParameter("pageNo"),0); - pageNo+=1; - Book book = (Book) WebUtils.copyParamToBean(req.getParameterMap(),new Book()); + // 获取当前页码，默认从0开始 + int pageNo = WebUtils.parseInt(req.getParameter("pageNo"), 0); + // 页码加1，表示添加书籍后跳转到下一页 + pageNo += 1; + + // 将请求参数封装到Book对象中 + Book book = (Book) WebUtils.copyParamToBean(req.getParameterMap(), new Book()); + + // 调用BookService的addBook方法添加书籍 bookService.addBook(book); - //req.getRequestDispatcher("/manager/bookServlet?action=list").forward(req,resp); - resp.sendRedirect(req.getContextPath() + "/manager/bookServlet?action=page&pageNo="+pageNo); - } + // 重定向到书籍管理页面，并跳转到添加书籍后的页码 + resp.sendRedirect(req.getContextPath() + "/manager/bookServlet?action=page&pageNo=" + pageNo); + } + /** + * 处理删除书籍的请求 + * @param req HttpServletRequest对象 + * @param resp HttpServletResponse对象 + * @throws ServletException + * @throws IOException + */ protected void delete(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { - String id = req.getParameter("id"); - int i = Integer.parseInt(id); - bookService.deleteBookById(i); - resp.sendRedirect(req.getContextPath() + "/manager/bookServlet?action=page&pageNo="+req.getParameter("pageNo")); - } + // 获取要删除的书籍ID + String id = req.getParameter("id"); + int i = Integer.parseInt(id); + // 调用BookService的deleteBookById方法删除书籍 + bookService.deleteBookById(i); + // 重定向到书籍管理页面，并保持当前页码 + resp.sendRedirect(req.getContextPath() + "/manager/bookServlet?action=page&pageNo=" + req.getParameter("pageNo")); + } + + /** + * 处理更新书籍的请求 + * @param req HttpServletRequest对象 + * @param resp HttpServletResponse对象 + * @throws ServletException + * @throws IOException + */ protected void update(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { - Book book = (Book) WebUtils.copyParamToBean(req.getParameterMap(),new Book()); + // 将请求参数封装到Book对象中 + Book book = (Book) WebUtils.copyParamToBean(req.getParameterMap(), new Book()); + + // 调用BookService的updateBook方法更新书籍 bookService.updateBook(book); - resp.sendRedirect(req.getContextPath() + "/manager/bookServlet?action=page&pageNo="+req.getParameter("pageNo")); + + // 重定向到书籍管理页面，并保持当前页码 + resp.sendRedirect(req.getContextPath() + "/manager/bookServlet?action=page&pageNo=" + req.getParameter("pageNo")); } /** - * - * @param req - * @param resp + * 处理获取单个书籍信息的请求 + * @param req HttpServletRequest对象 + * @param resp HttpServletResponse对象 * @throws ServletException * @throws IOException */ protected void getBook(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { + // 获取要查询的书籍ID String id = req.getParameter("id"); int i = Integer.parseInt(id); + + // 调用BookService的queryBookById方法查询书籍 Book book = bookService.queryBookById(i); - req.setAttribute("book",book); - req.getRequestDispatcher("/pages/manager/book_edit.jsp").forward(req,resp); - } + // 将查询到的书籍信息保存到request域中 + req.setAttribute("book", book); + // 请求转发到书籍编辑页面 + req.getRequestDispatcher("/pages/manager/book_edit.jsp").forward(req, resp); + } + + /** + * 处理查询所有书籍的请求 + * @param req HttpServletRequest对象 + * @param resp HttpServletResponse对象 + * @throws ServletException + * @throws IOException + */ protected void list(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { - //1、通过BookService查询数据 - Listbooks = bookService.queryBooks(); - //2、将数据保存在request域中 - req.setAttribute("books",books); - //3、请求转发到pages/manager/book_manager.jsp - req.getRequestDispatcher("/pages/manager/book_manager.jsp").forward(req,resp); + // 调用BookService的queryBooks方法查询所有书籍 + List books = bookService.queryBooks(); + + // 将查询到的书籍列表保存到request域中 + req.setAttribute("books", books); + + // 请求转发到书籍管理页面 + req.getRequestDispatcher("/pages/manager/book_manager.jsp").forward(req, resp); } + /** + * 处理分页查询书籍的请求 + * @param req HttpServletRequest对象 + * @param resp HttpServletResponse对象 + * @throws ServletException + * @throws IOException + */ protected void page(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { - //1、获取请求的参数pageNo和pageSize - int pageNo = WebUtils.parseInt(req.getParameter("pageNo"),1); + // 获取请求参数pageNo和pageSize + int pageNo = WebUtils.parseInt(req.getParameter("pageNo"), 1); int pageSize = WebUtils.parseInt(req.getParameter("pageSize"), Page.PAGE_SIZE); - //2、调用BookService.page(pageNo,pageSize)方法：返回page对象 - Page page = bookService.page(pageNo,pageSize); + // 调用BookService的page方法进行分页查询 + Page page = bookService.page(pageNo, pageSize); + + // 设置分页请求的URL page.setUrl("manager/bookServlet?action=page"); - //3、保存Page对象到request域中 - req.setAttribute("page",page); - //4、请求转发到page/manager/book_manager.jsp页面 - req.getRequestDispatcher("/pages/manager/book_manager.jsp").forward(req,resp); + // 将分页对象保存到request域中 + req.setAttribute("page", page); + + // 请求转发到书籍管理页面 + req.getRequestDispatcher("/pages/manager/book_manager.jsp").forward(req, resp); } -} +} \ No newline at end of file diff --git a/web/pages/client/index.jsp b/web/pages/client/index.jsp index 7ecae77..79b2494 100644 --- a/web/pages/client/index.jsp +++ b/web/pages/client/index.jsp @@ -16,18 +16,18 @@ <%@include file="/pages/common/header.jsp"%> @@ -35,25 +35,27 @@ Bookstore
+ - + 登录 | 注册    热榜 - + 欢迎${sessionScope.user.username}光临书城 我的订单 个人信息 注销   - + 购物车 后台管理
+
@@ -62,6 +64,7 @@
+
@@ -71,6 +74,7 @@
+
@@ -78,13 +82,16 @@
+ 您的购物车中有${sessionScope.cart.totalCount}件商品
+ 您刚刚将${sessionScope.lastName}加入到了购物车中
+
@@ -112,6 +119,7 @@ ${book.stock}
+
@@ -120,10 +128,12 @@
+ <%@include file="/pages/common/page_nav.jsp"%>
+ <%@include file="/pages/common/footer.jsp"%> - + \ No newline at end of file diff --git a/web/pages/common/header.jsp b/web/pages/common/header.jsp index 32ef403..9d25d1d 100644 --- a/web/pages/common/header.jsp +++ b/web/pages/common/header.jsp @@ -7,17 +7,27 @@ --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <% - String basePath = request.getScheme() - +"://" - +request.getServerName() - +":" - +request.getServerPort() - +request.getContextPath() - +"/"; - pageContext.setAttribute("bastPath",basePath); + // 获取当前请求的协议（如http或https） + String scheme = request.getScheme(); + // 获取服务器的主机名或IP地址 + String serverName = request.getServerName(); + // 获取服务器的端口号 + int serverPort = request.getServerPort(); + // 获取当前应用的上下文路径 + String contextPath = request.getContextPath(); + // 拼接basePath，用于构建项目的根路径 + String basePath = scheme + "://" + serverName + ":" + serverPort + contextPath + "/"; + + // 将basePath存储到pageContext中，方便在页面中使用 + pageContext.setAttribute("basePath", basePath); %> + -> - - + + + + + + + \ No newline at end of file diff --git a/web/pages/common/page_nav.jsp b/web/pages/common/page_nav.jsp index b719bb4..52246d0 100644 --- a/web/pages/common/page_nav.jsp +++ b/web/pages/common/page_nav.jsp @@ -8,71 +8,82 @@ <%@ page contentType="text/html;charset=UTF-8" language="java" %>
+ 首页 - - 上一页 + + + + 上一页 + <%-- 当总页码小于等于5的情况 --%> - - + - - + <%-- 当总页码大于5的情况 --%> <%-- 当前页码是前三 --%> - - + - <%-- 当前页码是后三 --%> - - - - - + + + - - - - + <%-- 当前页码在中间 --%> + + - - - - - 【${ i }】 - ${i} + + + 【${i}】 + + ${i} + - - 下一页 + + + 下一页 + 末页 + + 共${requestScope.page.pageTotal}页，${requestScope.page.pageTotalCount}条记录 + + 到第页 + diff --git a/web/pages/manager/book_edit.jsp b/web/pages/manager/book_edit.jsp index a877779..e7ec374 100644 --- a/web/pages/manager/book_edit.jsp +++ b/web/pages/manager/book_edit.jsp @@ -2,59 +2,74 @@ - -编辑图书 + + 编辑图书 <%@include file="/pages/common/header.jsp"%> - + - - -
-
- - - - - - - - - - - - - - - - - - - - -
名称价格作者销量库存操作
-
- - -
- - <%@include file="/pages/common/footer.jsp"%> + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
名称价格作者销量库存操作
+
+
+ +<%@include file="/pages/common/footer.jsp"%> \ No newline at end of file diff --git a/web/static/script/jquery-1.7.2.js b/web/static/script/jquery-1.7.2.js index 391f195..52b19e4 100644 --- a/web/static/script/jquery-1.7.2.js +++ b/web/static/script/jquery-1.7.2.js @@ -2129,1093 +2129,1142 @@ jQuery.extend({ } }); -jQuery.fn.extend({ - queue: function( type, data ) { - var setter = 2; +// 扩展jQuery对象的函数 + jQuery.fn.extend({ + // queue函数，用于处理元素队列 + queue: function( type, data ) { + var setter = 2; - if ( typeof type !== "string" ) { - data = type; - type = "fx"; - setter--; - } + // 如果type不是字符串，则将data和type的值互换，并将setter减1 + if ( typeof type !== "string" ) { + data = type; + type = "fx"; + setter--; + } - if ( arguments.length < setter ) { - return jQuery.queue( this[0], type ); - } + // 如果参数不足setter个数，则返回指定元素的队列 + if ( arguments.length < setter ) { + return jQuery.queue( this[0], type ); + } - return data === undefined ? - this : - this.each(function() { - var queue = jQuery.queue( this, type, data ); + // 如果data未定义，则直接返回this，否则遍历每个元素 + return data === undefined ? + this : + this.each(function() { + var queue = jQuery.queue( this, type, data ); - if ( type === "fx" && queue[0] !== "inprogress" ) { - jQuery.dequeue( this, type ); - } + // 如果type是"fx"且队列的第一个元素不是"inprogress"，则执行dequeue + if ( type === "fx" && queue[0] !== "inprogress" ) { + jQuery.dequeue( this, type ); + } + }); + }, + // dequeue函数，用于从队列中移除下一个待执行的函数 + dequeue: function( type ) { + return this.each(function() { + jQuery.dequeue( this, type ); }); - }, - dequeue: function( type ) { - return this.each(function() { - jQuery.dequeue( this, type ); - }); - }, - // Based off of the plugin by Clint Helfers, with permission. - // http://blindsignals.com/index.php/2009/07/jquery-delay/ - delay: function( time, type ) { - time = jQuery.fx ? jQuery.fx.speeds[ time ] || time : time; - type = type || "fx"; + }, + // delay函数，用于在队列中添加一个延时函数 + delay: function( time, type ) { + time = jQuery.fx ? jQuery.fx.speeds[ time ] || time : time; + type = type || "fx"; - return this.queue( type, function( next, hooks ) { - var timeout = setTimeout( next, time ); - hooks.stop = function() { - clearTimeout( timeout ); - }; - }); - }, - clearQueue: function( type ) { - return this.queue( type || "fx", [] ); - }, - // Get a promise resolved when queues of a certain type - // are emptied (fx is the type by default) - promise: function( type, object ) { - if ( typeof type !== "string" ) { - object = type; - type = undefined; - } - type = type || "fx"; - var defer = jQuery.Deferred(), - elements = this, - i = elements.length, - count = 1, - deferDataKey = type + "defer", - queueDataKey = type + "queue", - markDataKey = type + "mark", - tmp; - function resolve() { - if ( !( --count ) ) { - defer.resolveWith( elements, [ elements ] ); - } - } - while( i-- ) { - if (( tmp = jQuery.data( elements[ i ], deferDataKey, undefined, true ) || + // 在队列中添加一个延时函数 + return this.queue( type, function( next, hooks ) { + var timeout = setTimeout( next, time ); + hooks.stop = function() { + clearTimeout( timeout ); + }; + }); + }, + // clearQueue函数，用于清空指定类型的队列 + clearQueue: function( type ) { + return this.queue( type || "fx", [] ); + }, + // promise函数，用于获取一个在队列清空时解决的承诺 + promise: function( type, object ) { + if ( typeof type !== "string" ) { + object = type; + type = undefined; + } + type = type || "fx"; + var defer = jQuery.Deferred(), + elements = this, + i = elements.length, + count = 1, + deferDataKey = type + "defer", + queueDataKey = type + "queue", + markDataKey = type + "mark", + tmp; + function resolve() { + if ( !( --count ) ) { + defer.resolveWith( elements, [ elements ] ); + } + } + while( i-- ) { + if (( tmp = jQuery.data( elements[ i ], deferDataKey, undefined, true ) || ( jQuery.data( elements[ i ], queueDataKey, undefined, true ) || jQuery.data( elements[ i ], markDataKey, undefined, true ) ) && jQuery.data( elements[ i ], deferDataKey, jQuery.Callbacks( "once memory" ), true ) )) { - count++; - tmp.add( resolve ); + count++; + tmp.add( resolve ); + } } + resolve(); + return defer.promise( object ); } - resolve(); - return defer.promise( object ); - } -}); - - - - -var rclass = /[\n\t\r]/g, - rspace = /\s+/, - rreturn = /\r/g, - rtype = /^(?:button|input)$/i, - rfocusable = /^(?:button|input|object|select|textarea)$/i, - rclickable = /^a(?:rea)?$/i, - rboolean = /^(?:autofocus|autoplay|async|checked|controls|defer|disabled|hidden|loop|multiple|open|readonly|required|scoped|selected)$/i, - getSetAttribute = jQuery.support.getSetAttribute, - nodeHook, boolHook, fixSpecified; - -jQuery.fn.extend({ - attr: function( name, value ) { - return jQuery.access( this, jQuery.attr, name, value, arguments.length > 1 ); - }, - - removeAttr: function( name ) { - return this.each(function() { - jQuery.removeAttr( this, name ); - }); - }, - - prop: function( name, value ) { - return jQuery.access( this, jQuery.prop, name, value, arguments.length > 1 ); - }, - - removeProp: function( name ) { - name = jQuery.propFix[ name ] || name; - return this.each(function() { - // try/catch handles cases where IE balks (such as removing a property on window) - try { - this[ name ] = undefined; - delete this[ name ]; - } catch( e ) {} - }); - }, - - addClass: function( value ) { - var classNames, i, l, elem, - setClass, c, cl; + }); - if ( jQuery.isFunction( value ) ) { - return this.each(function( j ) { - jQuery( this ).addClass( value.call(this, j, this.className) ); +// 正则表达式，用于去除字符串中的换行、制表符和回车符 + var rclass = /[\n\t\r]/g, + // 正则表达式，用于匹配一个或多个空格 + rspace = /\s+/, + // 正则表达式，用于匹配回车符 + rreturn = /\r/g, + // 正则表达式，用于匹配button或input元素 + rtype = /^(?:button|input)$/i, + // 正则表达式，用于匹配button、input、object、select或textarea元素 + rfocusable = /^(?:button|input|object|select|textarea)$/i, + // 正则表达式，用于匹配a或area元素 + rclickable = /^a(?:rea)?$/i, + // 正则表达式，用于匹配布尔属性 + rboolean = /^(?:autofocus|autoplay|async|checked|controls|defer|disabled|hidden|loop|multiple|open|readonly|required|scoped|selected)$/i, + // 检查是否支持getAttribute和setAttribute + getSetAttribute = jQuery.support.getSetAttribute, + nodeHook, boolHook, fixSpecified; + +// 扩展jQuery对象的函数，用于属性和属性值的操作 + jQuery.fn.extend({ + // attr函数，用于获取或设置元素的属性值 + attr: function( name, value ) { + return jQuery.access( this, jQuery.attr, name, value, arguments.length > 1 ); + }, + // removeAttr函数，用于移除元素的属性 + removeAttr: function( name ) { + return this.each(function() { + jQuery.removeAttr( this, name ); }); - } + }, + // prop函数，用于获取或设置元素的属性值（适用于标准属性） + prop: function( name, value ) { + return jQuery.access( this, jQuery.prop, name, value, arguments.length > 1 ); + }, + // removeProp函数，用于移除元素的属性（适用于标准属性） + removeProp: function( name ) { + name = jQuery.propFix[ name ] || name; + return this.each(function() { + // try/catch处理IE浏览器中删除属性时可能抛出的异常 + try { + this[ name ] = undefined; + delete this[ name ]; + } catch( e ) {} + }); + }, + // addClass函数，用于给元素添加类名 + addClass: function( value ) { + var classNames, i, l, elem, + setClass, c, cl; - if ( value && typeof value === "string" ) { - classNames = value.split( rspace ); + // 如果value是函数，则为每个元素调用该函数，并添加返回的类名 + if ( jQuery.isFunction( value ) ) { + return this.each(function( j ) { + jQuery( this ).addClass( value.call(this, j, this.className) ); + }); + } - for ( i = 0, l = this.length; i < l; i++ ) { - elem = this[ i ]; + // 如果value是字符串，则按空格分割类名，并为每个元素添加这些类名 + if ( value && typeof value === "string" ) { + classNames = value.split( rspace ); - if ( elem.nodeType === 1 ) { - if ( !elem.className && classNames.length === 1 ) { - elem.className = value; + for ( i = 0, l = this.length; i < l; i++ ) { + elem = this[ i ]; - } else { - setClass = " " + elem.className + " "; + // 如果元素是元素节点且没有类名，则直接设置类名 + if ( elem.nodeType === 1 ) { + if ( !elem.className && classNames.length === 1 ) { + elem.className = value; + + } else { + // 如果元素已经有类名，则在已有类名基础上添加新类名 + setClass = " " + elem.className + " "; - for ( c = 0, cl = classNames.length; c < cl; c++ ) { - if ( !~setClass.indexOf( " " + classNames[ c ] + " " ) ) { - setClass += classNames[ c ] + " "; + for ( c = 0, cl = classNames.length; c < cl; c++ ) { + if ( !~setClass.indexOf( " " + classNames[ c ] + " " ) ) { + setClass += classNames[ c ] + " "; + } } + elem.className = jQuery.trim( setClass ); } - elem.className = jQuery.trim( setClass ); } } } - } - return this; - }, + // 返回this，以支持链式调用 + return this; + }, + // removeClass函数，用于从元素中移除类名 + removeClass: function( value ) { + var classNames, i, l, elem, className, c, cl; - removeClass: function( value ) { - var classNames, i, l, elem, className, c, cl; + // 如果value是函数，则为每个元素调用该函数，并移除返回的类名 + if ( jQuery.isFunction( value ) ) { + return this.each(function( j ) { + jQuery( this ).removeClass( value.call(this, j, this.className) ); + }); + } - if ( jQuery.isFunction( value ) ) { - return this.each(function( j ) { - jQuery( this ).removeClass( value.call(this, j, this.className) ); - }); - } + // 如果value是字符串或undefined，则按空格分割类名，并为每个元素移除这些类名 + if ( (value && typeof value === "string") || value === undefined ) { + classNames = ( value || "" ).split( rspace ); - if ( (value && typeof value === "string") || value === undefined ) { - classNames = ( value || "" ).split( rspace ); + // 遍历每个元素，对每个元素执行以下操作 + for ( i = 0, l = this.length; i < l; i++ ) { + elem = this[ i ]; // 获取当前遍历的元素 - for ( i = 0, l = this.length; i < l; i++ ) { - elem = this[ i ]; + // 如果元素是元素节点并且有类名 + if ( elem.nodeType === 1 && elem.className ) { + if ( value ) { + // 如果value存在，则创建一个包含当前类名和新类名的字符串 + className = (" " + elem.className + " ").replace( rclass, " " ); + // 遍历所有要移除的类名 + for ( c = 0, cl = classNames.length; c < cl; c++ ) { + // 移除类名 + className = className.replace(" " + classNames[ c ] + " ", " "); + } + // 更新元素的类名 + elem.className = jQuery.trim( className ); - if ( elem.nodeType === 1 && elem.className ) { - if ( value ) { - className = (" " + elem.className + " ").replace( rclass, " " ); - for ( c = 0, cl = classNames.length; c < cl; c++ ) { - className = className.replace(" " + classNames[ c ] + " ", " "); + } else { + // 如果value不存在，则清空元素的类名 + elem.className = ""; } - elem.className = jQuery.trim( className ); - - } else { - elem.className = ""; } } - } - } - return this; - }, +// 返回this，以支持链式调用 + return this; + }, - toggleClass: function( value, stateVal ) { - var type = typeof value, - isBool = typeof stateVal === "boolean"; +// toggleClass函数，用于根据条件切换元素的类名 + toggleClass: function( value, stateVal ) { + var type = typeof value, + isBool = typeof stateVal === "boolean"; - if ( jQuery.isFunction( value ) ) { - return this.each(function( i ) { - jQuery( this ).toggleClass( value.call(this, i, this.className, stateVal), stateVal ); - }); - } + // 如果value是函数，则对每个元素执行该函数，并根据返回值切换类名 + if ( jQuery.isFunction( value ) ) { + return this.each(function( i ) { + jQuery( this ).toggleClass( value.call(this, i, this.className, stateVal), stateVal ); + }); + } - return this.each(function() { - if ( type === "string" ) { - // toggle individual class names - var className, - i = 0, - self = jQuery( this ), - state = stateVal, - classNames = value.split( rspace ); + // 对每个元素执行类名切换操作 + return this.each(function() { + if ( type === "string" ) { + // 切换单个类名 + var className, + i = 0, + self = jQuery( this ), + state = stateVal, + classNames = value.split( rspace ); + + while ( (className = classNames[ i++ ]) ) { + // 检查每个给定的类名，空格分隔的列表 + state = isBool ? state : !self.hasClass( className ); + self[ state ? "addClass" : "removeClass" ]( className ); + } - while ( (className = classNames[ i++ ]) ) { - // check each className given, space seperated list - state = isBool ? state : !self.hasClass( className ); - self[ state ? "addClass" : "removeClass" ]( className ); - } + } else if ( type === "undefined" || type === "boolean" ) { + if ( this.className ) { + // 如果设置了类名，则存储类名 + jQuery._data( this, "__className__", this.className ); + } + + // 切换整个类名 + this.className = this.className || value === false ? "" : jQuery._data( this, "__className__" ) || ""; + } + }); + }, - } else if ( type === "undefined" || type === "boolean" ) { - if ( this.className ) { - // store className if set - jQuery._data( this, "__className__", this.className ); +// hasClass函数，用于检查元素是否包含指定的类名 + hasClass: function( selector ) { + var className = " " + selector + " ", + i = 0, + l = this.length; + for ( ; i < l; i++ ) { + if ( this[i].nodeType === 1 && (" " + this[i].className + " ").replace(rclass, " ").indexOf( className ) > -1 ) { + return true; + } } - // toggle whole className - this.className = this.className || value === false ? "" : jQuery._data( this, "__className__" ) || ""; - } - }); - }, + return false; + }, - hasClass: function( selector ) { - var className = " " + selector + " ", - i = 0, - l = this.length; - for ( ; i < l; i++ ) { - if ( this[i].nodeType === 1 && (" " + this[i].className + " ").replace(rclass, " ").indexOf( className ) > -1 ) { - return true; - } - } +// val函数，用于获取或设置表单元素的值 + val: function( value ) { + var hooks, ret, isFunction, + elem = this[0]; - return false; - }, + // 如果没有参数，则获取第一个元素的值 + if ( !arguments.length ) { + if ( elem ) { + hooks = jQuery.valHooks[ elem.type ] || jQuery.valHooks[ elem.nodeName.toLowerCase() ]; - val: function( value ) { - var hooks, ret, isFunction, - elem = this[0]; + if ( hooks && "get" in hooks && (ret = hooks.get( elem, "value" )) !== undefined ) { + return ret; + } - if ( !arguments.length ) { - if ( elem ) { - hooks = jQuery.valHooks[ elem.type ] || jQuery.valHooks[ elem.nodeName.toLowerCase() ]; + ret = elem.value; - if ( hooks && "get" in hooks && (ret = hooks.get( elem, "value" )) !== undefined ) { - return ret; - } + return typeof ret === "string" ? + // 处理最常见的字符串情况 + ret.replace(rreturn, "") : + // 处理值是null/undef或数字的情况 + ret == null ? "" : ret; + } - ret = elem.value; + return; + } - return typeof ret === "string" ? - // handle most common string cases - ret.replace(rreturn, "") : - // handle cases where value is null/undef or number - ret == null ? "" : ret; - } + isFunction = jQuery.isFunction( value ); - return; - } + // 对每个元素执行值设置操作 + return this.each(function( i ) { + var self = jQuery(this), val; - isFunction = jQuery.isFunction( value ); + if ( this.nodeType !== 1 ) { + return; + } - return this.each(function( i ) { - var self = jQuery(this), val; + if ( isFunction ) { + val = value.call( this, i, self.val() ); + } else { + val = value; + } - if ( this.nodeType !== 1 ) { - return; - } + // 将null/undefined视为""；将数字转换为字符串 + if ( val == null ) { + val = ""; + } else if ( typeof val === "number" ) { + val += ""; + } else if ( jQuery.isArray( val ) ) { + val = jQuery.map(val, function ( value ) { + return value == null ? "" : value + ""; + }); + } - if ( isFunction ) { - val = value.call( this, i, self.val() ); - } else { - val = value; - } + hooks = jQuery.valHooks[ this.type ] || jQuery.valHooks[ this.nodeName.toLowerCase() ]; - // Treat null/undefined as ""; convert numbers to string - if ( val == null ) { - val = ""; - } else if ( typeof val === "number" ) { - val += ""; - } else if ( jQuery.isArray( val ) ) { - val = jQuery.map(val, function ( value ) { - return value == null ? "" : value + ""; + // 如果set返回undefined，则回退到正常设置 + if ( !hooks || !("set" in hooks) || hooks.set( this, val, "value" ) === undefined ) { + this.value = val; + } }); } - hooks = jQuery.valHooks[ this.type ] || jQuery.valHooks[ this.nodeName.toLowerCase() ]; - - // If set returns undefined, fall back to normal setting - if ( !hooks || !("set" in hooks) || hooks.set( this, val, "value" ) === undefined ) { - this.value = val; - } - }); - } -}); - -jQuery.extend({ - valHooks: { - option: { - get: function( elem ) { - // attributes.value is undefined in Blackberry 4.7 but - // uses .value. See #6932 - var val = elem.attributes.value; - return !val || val.specified ? elem.value : elem.text; - } - }, - select: { - get: function( elem ) { - var value, i, max, option, - index = elem.selectedIndex, - values = [], - options = elem.options, - one = elem.type === "select-one"; - - // Nothing was selected - if ( index < 0 ) { - return null; - } - - // Loop through all the selected options - i = one ? index : 0; - max = one ? index + 1 : options.length; - for ( ; i < max; i++ ) { - option = options[ i ]; - - // Don't return options that are disabled or in a disabled optgroup - if ( option.selected && (jQuery.support.optDisabled ? !option.disabled : option.getAttribute("disabled") === null) && - (!option.parentNode.disabled || !jQuery.nodeName( option.parentNode, "optgroup" )) ) { - - // Get the specific value for the option - value = jQuery( option ).val(); - - // We don't need an array for one selects - if ( one ) { - return value; + jQuery.extend({ + valHooks: { + // option元素的值钩子 + option: { + get: function( elem ) { + // 在Blackberry 4.7中attributes.value是undefined，但使用.value + var val = elem.attributes.value; + return !val || val.specified ? elem.value : elem.text; } + }, + // select元素的值钩子 + select: { + get: function( elem ) { + var value, i, max, option, + index = elem.selectedIndex, + values = [], + options = elem.options, + one = elem.type === "select-one"; + + // 没有选中任何选项 + if ( index < 0 ) { + return null; + } - // Multi-Selects return an array - values.push( value ); - } - } + // 遍历所有选中的选项 + i = one ? index : 0; + max = one ? index + 1 : options.length; + for ( ; i < max; i++ ) { + option = options[ i ]; - // Fixes Bug #2551 -- select.val() broken in IE after form.reset() - if ( one && !values.length && options.length ) { - return jQuery( options[ index ] ).val(); - } + // 不返回禁用的选项或在禁用的optgroup中的选项 + if ( option.selected && (jQuery.support.optDisabled ? !option.disabled : option.getAttribute("disabled") === null) && + (!(option.parentNode.disabled || !jQuery.nodeName( option.parentNode, "optgroup" )) ) ) { - return values; - }, + // 获取选项的特定值 + value = jQuery( option ).val(); - set: function( elem, value ) { - var values = jQuery.makeArray( value ); + // 单选不需要数组 + if ( one ) { + return value; + } - jQuery(elem).find("option").each(function() { - this.selected = jQuery.inArray( jQuery(this).val(), values ) >= 0; - }); + // 多选返回数组 + values.push( value ); + } + } - if ( !values.length ) { - elem.selectedIndex = -1; - } - return values; - } - } - }, + // 修复Bug #2551 -- 在表单重置后select.val()在IE中被破坏 + if ( one && !values.length && options.length ) { + return jQuery( options[ index ] ).val(); + } - attrFn: { - val: true, - css: true, - html: true, - text: true, - data: true, - width: true, - height: true, - offset: true - }, + return values; + }, - attr: function( elem, name, value, pass ) { - var ret, hooks, notxml, - nType = elem.nodeType; + set: function( elem, value ) { + var values = jQuery.makeArray( value ); - // don't get/set attributes on text, comment and attribute nodes - if ( !elem || nType === 3 || nType === 8 || nType === 2 ) { - return; - } + jQuery(elem).find("option").each(function() { + this.selected = jQuery.inArray( jQuery(this).val(), values ) >= 0; + }); - if ( pass && name in jQuery.attrFn ) { - return jQuery( elem )[ name ]( value ); - } + if ( !values.length ) { + elem.selectedIndex = -1; + } + return values; + } + } + }, - // Fallback to prop when attributes are not supported - if ( typeof elem.getAttribute === "undefined" ) { - return jQuery.prop( elem, name, value ); - } + // 定义一个对象，包含那些可以通过jQuery.attr和jQuery.prop直接访问的属性和方法 + attrFn: { + val: true, // 值属性 + css: true, // CSS样式 + html: true, // 内部HTML + text: true, // 文本内容 + data: true, // 数据属性 + width: true, // 宽度 + height: true, // 高度 + offset: true // 偏移位置 + }, - notxml = nType !== 1 || !jQuery.isXMLDoc( elem ); +// attr函数，用于获取或设置元素的属性值 + attr: function( elem, name, value, pass ) { + var ret, hooks, notxml, + nType = elem.nodeType; - // All attributes are lowercase - // Grab necessary hook if one is defined - if ( notxml ) { - name = name.toLowerCase(); - hooks = jQuery.attrHooks[ name ] || ( rboolean.test( name ) ? boolHook : nodeHook ); - } + // 不对文本、注释和属性节点进行属性的获取和设置 + if ( !elem || nType === 3 || nType === 8 || nType === 2 ) { + return; + } - if ( value !== undefined ) { + if ( pass && name in jQuery.attrFn ) { + return jQuery( elem )[ name ]( value ); + } - if ( value === null ) { - jQuery.removeAttr( elem, name ); + // 当元素不支持属性时，回退到prop + if ( typeof elem.getAttribute === "undefined" ) { + return jQuery.prop( elem, name, value ); + } + notxml = nType !== 1 || !jQuery.isXMLDoc( elem ); - } else if ( hooks && "set" in hooks && notxml && (ret = hooks.set( elem, value, name )) !== undefined ) { - return ret; + // 所有属性都转换为小写 + // 如果定义了必要的钩子，则获取它 + if ( notxml ) { + name = name.toLowerCase(); + hooks = jQuery.attrHooks[ name ] || ( rboolean.test( name ) ? boolHook : nodeHook ); + } - } else { - elem.setAttribute( name, "" + value ); - return value; - } + if ( value !== undefined ) { - } else if ( hooks && "get" in hooks && notxml && (ret = hooks.get( elem, name )) !== null ) { - return ret; + if ( value === null ) { + jQuery.removeAttr( elem, name ); + } else if ( hooks && "set" in hooks && notxml && (ret = hooks.set( elem, value, name )) !== undefined ) { + return ret; + } else { + elem.setAttribute( name, "" + value ); + return value; + } - } else { + } else if ( hooks && "get" in hooks && notxml && (ret = hooks.get( elem, name )) !== null ) { + return ret; - ret = elem.getAttribute( name ); + } else { - // Non-existent attributes return null, we normalize to undefined - return ret === null ? - undefined : - ret; - } - }, + ret = elem.getAttribute( name ); - removeAttr: function( elem, value ) { - var propName, attrNames, name, l, isBool, - i = 0; + // 非存在的属性返回null，我们将其标准化为undefined + return ret === null ? + undefined : + ret; + } + }, - if ( value && elem.nodeType === 1 ) { - attrNames = value.toLowerCase().split( rspace ); - l = attrNames.length; +// removeAttr函数，用于移除元素的一个或多个属性 + removeAttr: function( elem, value ) { + var propName, attrNames, name, l, isBool, + i = 0; - for ( ; i < l; i++ ) { - name = attrNames[ i ]; + if ( value && elem.nodeType === 1 ) { + attrNames = value.toLowerCase().split( rspace ); + l = attrNames.length; - if ( name ) { - propName = jQuery.propFix[ name ] || name; - isBool = rboolean.test( name ); + for ( ; i < l; i++ ) { + name = attrNames[ i ]; - // See #9699 for explanation of this approach (setting first, then removal) - // Do not do this for boolean attributes (see #10870) - if ( !isBool ) { - jQuery.attr( elem, name, "" ); - } - elem.removeAttribute( getSetAttribute ? name : propName ); + if ( name ) { + propName = jQuery.propFix[ name ] || name; + isBool = rboolean.test( name ); + + // 见#9699的解释（先设置，然后移除） + // 对于布尔属性不要这样做（见#10870） + if ( !isBool ) { + jQuery.attr( elem, name, "" ); + } + elem.removeAttribute( getSetAttribute ? name : propName ); - // Set corresponding property to false for boolean attributes - if ( isBool && propName in elem ) { - elem[ propName ] = false; + // 对于布尔属性，将对应的属性设置为false + if ( isBool && propName in elem ) { + elem[ propName ] = false; + } + } + } } - } - } - } - }, + }, - attrHooks: { - type: { - set: function( elem, value ) { - // We can't allow the type property to be changed (since it causes problems in IE) - if ( rtype.test( elem.nodeName ) && elem.parentNode ) { - jQuery.error( "type property can't be changed" ); - } else if ( !jQuery.support.radioValue && value === "radio" && jQuery.nodeName(elem, "input") ) { - // Setting the type on a radio button after the value resets the value in IE6-9 - // Reset value to it's default in case type is set after value - // This is for element creation - var val = elem.value; - elem.setAttribute( "type", value ); - if ( val ) { - elem.value = val; +// attrHooks对象，包含特定属性的获取和设置钩子 + attrHooks: { + type: { + set: function( elem, value ) { + // 我们不允许改变type属性（因为这在IE中会导致问题） + if ( rtype.test( elem.nodeName ) && elem.parentNode ) { + jQuery.error( "type property can't be changed" ); + } else if ( !jQuery.support.radioValue && value === "radio" && jQuery.nodeName(elem, "input") ) { + // 在IE6-9中，设置radio按钮的type属性后，value会重置 + // 如果type属性在value属性之后设置，则重置value为其默认值 + // 这是为了元素创建 + var val = elem.value; + elem.setAttribute( "type", value ); + if ( val ) { + elem.value = val; + } + return value; + } + } + }, + // 为了向后兼容，使用value属性 + // 在IE6/7中使用nodeHook处理按钮元素（#1954） + value: { + get: function( elem, name ) { + if ( nodeHook && jQuery.nodeName( elem, "button" ) ) { + return nodeHook.get( elem, name ); + } + return name in elem ? + elem.value : + null; + }, + set: function( elem, value, name ) { + if ( nodeHook && jQuery.nodeName( elem, "button" ) ) { + return nodeHook.set( elem, value, name ); + } + // 不返回，以便也使用setAttribute + elem.value = value; + } } - return value; - } - } - }, - // Use the value property for back compat - // Use the nodeHook for button elements in IE6/7 (#1954) - value: { - get: function( elem, name ) { - if ( nodeHook && jQuery.nodeName( elem, "button" ) ) { - return nodeHook.get( elem, name ); - } - return name in elem ? - elem.value : - null; - }, - set: function( elem, value, name ) { - if ( nodeHook && jQuery.nodeName( elem, "button" ) ) { - return nodeHook.set( elem, value, name ); - } - // Does not return so that setAttribute is also used - elem.value = value; - } - } - }, + }, - propFix: { - tabindex: "tabIndex", - readonly: "readOnly", - "for": "htmlFor", - "class": "className", - maxlength: "maxLength", - cellspacing: "cellSpacing", - cellpadding: "cellPadding", - rowspan: "rowSpan", - colspan: "colSpan", - usemap: "useMap", - frameborder: "frameBorder", - contenteditable: "contentEditable" - }, - - prop: function( elem, name, value ) { - var ret, hooks, notxml, - nType = elem.nodeType; - - // don't get/set properties on text, comment and attribute nodes - if ( !elem || nType === 3 || nType === 8 || nType === 2 ) { - return; - } +// propFix对象，包含属性名的修正 + propFix: { + tabindex: "tabIndex", + readonly: "readOnly", + "for": "htmlFor", + "class": "className", + maxlength: "maxLength", + cellspacing: "cellSpacing", + cellpadding: "cellPadding", + rowspan: "rowSpan", + colspan: "colSpan", + usemap: "useMap", + frameborder: "frameBorder", + contenteditable: "contentEditable" + }, - notxml = nType !== 1 || !jQuery.isXMLDoc( elem ); +// prop函数，用于获取或设置元素的标准属性值 + prop: function( elem, name, value ) { + var ret, hooks, notxml, + nType = elem.nodeType; - if ( notxml ) { - // Fix name and attach hooks - name = jQuery.propFix[ name ] || name; - hooks = jQuery.propHooks[ name ]; - } + // 不对文本、注释和属性节点进行属性的获取和设置 + if ( !elem || nType === 3 || nType === 8 || nType === 2 ) { + return; + } - if ( value !== undefined ) { - if ( hooks && "set" in hooks && (ret = hooks.set( elem, value, name )) !== undefined ) { - return ret; + notxml = nType !== 1 || !jQuery.isXMLDoc( elem ); - } else { - return ( elem[ name ] = value ); - } + if ( notxml ) { + // 修正名称并附加钩子 + name = jQuery.propFix[ name ] || name; + hooks = jQuery.propHooks[ name ]; + } - } else { - if ( hooks && "get" in hooks && (ret = hooks.get( elem, name )) !== null ) { - return ret; + if ( value !== undefined ) { + if ( hooks && "set" in hooks && (ret = hooks.set( elem, value, name )) !== undefined ) { + return ret; - } else { - return elem[ name ]; - } - } - }, + } else { + return ( elem[ name ] = value ); + } - propHooks: { - tabIndex: { - get: function( elem ) { - // elem.tabIndex doesn't always return the correct value when it hasn't been explicitly set - // http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/ - var attributeNode = elem.getAttributeNode("tabindex"); + } else { + if ( hooks && "get" in hooks && (ret = hooks.get( elem, name )) !== null ) { + return ret; - return attributeNode && attributeNode.specified ? - parseInt( attributeNode.value, 10 ) : - rfocusable.test( elem.nodeName ) || rclickable.test( elem.nodeName ) && elem.href ? - 0 : - undefined; - } - } - } -}); + } else { + return elem[ name ]; + } + } + }, +// propHooks对象，包含特定属性的获取和设置钩子 + propHooks: { + tabIndex: { + get: function( elem ) { + // elem.tabIndex并不总是返回正确的值，当它没有被显式设置时 + // http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/ + var attributeNode = elem.getAttributeNode("tabindex"); + + return attributeNode && attributeNode.specified ? + parseInt( attributeNode.value, 10 ) : + rfocusable.test( elem.nodeName ) || rclickable.test( elem.nodeName ) && elem.href ? + 0 : + undefined; + } + } + } + }); // Add the tabIndex propHook to attrHooks for back-compat (different case is intentional) jQuery.attrHooks.tabindex = jQuery.propHooks.tabIndex; // Hook for boolean attributes -boolHook = { - get: function( elem, name ) { - // Align boolean attributes with corresponding properties - // Fall back to attribute presence where some booleans are not supported - var attrNode, - property = jQuery.prop( elem, name ); - return property === true || typeof property !== "boolean" && ( attrNode = elem.getAttributeNode(name) ) && attrNode.nodeValue !== false ? - name.toLowerCase() : - undefined; - }, - set: function( elem, value, name ) { - var propName; - if ( value === false ) { - // Remove boolean attributes when set to false - jQuery.removeAttr( elem, name ); - } else { - // value is true since we know at this point it's type boolean and not false - // Set boolean attributes to the same name and set the DOM property - propName = jQuery.propFix[ name ] || name; - if ( propName in elem ) { - // Only set the IDL specifically if it already exists on the element - elem[ propName ] = true; - } - - elem.setAttribute( name, name.toLowerCase() ); - } - return name; - } -}; +// 定义布尔属性的获取和设置钩子 + boolHook = { + get: function( elem, name ) { + // 将布尔属性与相应的属性对齐 + // 在一些布尔属性不受支持的地方，回退到属性存在性检查 + var attrNode, + property = jQuery.prop( elem, name ); + return property === true || typeof property !== "boolean" && ( attrNode = elem.getAttributeNode(name) ) && attrNode.nodeValue !== false ? + name.toLowerCase() : + undefined; + }, + set: function( elem, value, name ) { + var propName; + if ( value === false ) { + // 当设置为false时，移除布尔属性 + jQuery.removeAttr( elem, name ); + } else { + // 我们知道此时value为true，因为它是布尔类型且不是false + // 设置布尔属性为相同名称，并设置DOM属性 + propName = jQuery.propFix[ name ] || name; + if ( propName in elem ) { + // 仅当IDL已经存在于元素上时，才设置IDL + elem[ propName ] = true; + } -// IE6/7 do not support getting/setting some attributes with get/setAttribute -if ( !getSetAttribute ) { + elem.setAttribute( name, name.toLowerCase() ); + } + return name; + } + }; - fixSpecified = { - name: true, - id: true, - coords: true - }; +// IE6/7不支持通过get/setAttribute获取/设置某些属性 + if ( !getSetAttribute ) { - // Use this for any attribute in IE6/7 - // This fixes almost every IE6/7 issue - nodeHook = jQuery.valHooks.button = { - get: function( elem, name ) { - var ret; - ret = elem.getAttributeNode( name ); - return ret && ( fixSpecified[ name ] ? ret.nodeValue !== "" : ret.specified ) ? - ret.nodeValue : - undefined; - }, - set: function( elem, value, name ) { - // Set the existing or create a new attribute node - var ret = elem.getAttributeNode( name ); - if ( !ret ) { - ret = document.createAttribute( name ); - elem.setAttributeNode( ret ); - } - return ( ret.nodeValue = value + "" ); - } - }; + fixSpecified = { + name: true, + id: true, + coords: true + }; - // Apply the nodeHook to tabindex - jQuery.attrHooks.tabindex.set = nodeHook.set; + // 用于IE6/7中的任何属性 + // 这几乎修复了所有IE6/7的问题 + nodeHook = jQuery.valHooks.button = { + get: function( elem, name ) { + var ret; + ret = elem.getAttributeNode( name ); + return ret && ( fixSpecified[ name ] ? ret.nodeValue !== "" : ret.specified ) ? + ret.nodeValue : + undefined; + }, + set: function( elem, value, name ) { + // 设置现有的或创建一个新的属性节点 + var ret = elem.getAttributeNode( name ); + if ( !ret ) { + ret = document.createAttribute( name ); + elem.setAttributeNode( ret ); + } + return ( ret.nodeValue = value + "" ); + } + }; - // Set width and height to auto instead of 0 on empty string( Bug #8150 ) - // This is for removals - jQuery.each([ "width", "height" ], function( i, name ) { - jQuery.attrHooks[ name ] = jQuery.extend( jQuery.attrHooks[ name ], { - set: function( elem, value ) { - if ( value === "" ) { - elem.setAttribute( name, "auto" ); - return value; - } - } - }); - }); + // 将nodeHook应用于tabindex + jQuery.attrHooks.tabindex.set = nodeHook.set; + + // 在空字符串时将width和height设置为auto而不是0（Bug #8150） + // 这是为了移除操作 + jQuery.each([ "width", "height" ], function( i, name ) { + jQuery.attrHooks[ name ] = jQuery.extend( jQuery.attrHooks[ name ], { + set: function( elem, value ) { + if ( value === "" ) { + elem.setAttribute( name, "auto" ); + return value; + } + } + }); + }); - // Set contenteditable to false on removals(#10429) - // Setting to empty string throws an error as an invalid value - jQuery.attrHooks.contenteditable = { - get: nodeHook.get, - set: function( elem, value, name ) { - if ( value === "" ) { - value = "false"; + // 在移除时将contenteditable设置为false（#10429） + // 设置为空字符串会因为无效值而抛出错误 + jQuery.attrHooks.contenteditable = { + get: nodeHook.get, + set: function( elem, value, name ) { + if ( value === "" ) { + value = "false"; + } + nodeHook.set( elem, value, name ); + } + }; } - nodeHook.set( elem, value, name ); - } - }; -} - -// Some attributes require a special call on IE -if ( !jQuery.support.hrefNormalized ) { - jQuery.each([ "href", "src", "width", "height" ], function( i, name ) { - jQuery.attrHooks[ name ] = jQuery.extend( jQuery.attrHooks[ name ], { - get: function( elem ) { - var ret = elem.getAttribute( name, 2 ); - return ret === null ? undefined : ret; +// IE不支持href属性的规范化 + if ( !jQuery.support.hrefNormalized ) { + jQuery.each([ "href", "src", "width", "height" ], function( i, name ) { + jQuery.attrHooks[ name ] = jQuery.extend( jQuery.attrHooks[ name ], { + get: function( elem ) { + var ret = elem.getAttribute( name, 2 ); + return ret === null ? undefined : ret; + } + }); + }); } - }); - }); -} - -if ( !jQuery.support.style ) { - jQuery.attrHooks.style = { - get: function( elem ) { - // Return undefined in the case of empty string - // Normalize to lowercase since IE uppercases css property names - return elem.style.cssText.toLowerCase() || undefined; - }, - set: function( elem, value ) { - return ( elem.style.cssText = "" + value ); - } - }; -} - -// Safari mis-reports the default selected property of an option -// Accessing the parent's selectedIndex property fixes it -if ( !jQuery.support.optSelected ) { - jQuery.propHooks.selected = jQuery.extend( jQuery.propHooks.selected, { - get: function( elem ) { - var parent = elem.parentNode; - - if ( parent ) { - parent.selectedIndex; - // Make sure that it also works with optgroups, see #5701 - if ( parent.parentNode ) { - parent.parentNode.selectedIndex; - } +// IE不支持style属性 + if ( !jQuery.support.style ) { + jQuery.attrHooks.style = { + get: function( elem ) { + // 在空字符串的情况下返回undefined + // 将IE中的css属性名统一为小写 + return elem.style.cssText.toLowerCase() || undefined; + }, + set: function( elem, value ) { + return ( elem.style.cssText = "" + value ); + } + }; } - return null; - } - }); -} -// IE6/7 call enctype encoding -if ( !jQuery.support.enctype ) { - jQuery.propFix.enctype = "encoding"; -} +// Safari错误地报告了option的默认selected属性 +// 访问父元素的selectedIndex属性可以修复它 + if ( !jQuery.support.optSelected ) { + jQuery.propHooks.selected = jQuery.extend( jQuery.propHooks.selected, { + get: function( elem ) { + var parent = elem.parentNode; -// Radios and checkboxes getter/setter -if ( !jQuery.support.checkOn ) { - jQuery.each([ "radio", "checkbox" ], function() { - jQuery.valHooks[ this ] = { - get: function( elem ) { - // Handle the case where in Webkit "" is returned instead of "on" if a value isn't specified - return elem.getAttribute("value") === null ? "on" : elem.value; - } - }; - }); -} -jQuery.each([ "radio", "checkbox" ], function() { - jQuery.valHooks[ this ] = jQuery.extend( jQuery.valHooks[ this ], { - set: function( elem, value ) { - if ( jQuery.isArray( value ) ) { - return ( elem.checked = jQuery.inArray( jQuery(elem).val(), value ) >= 0 ); - } - } - }); -}); + if ( parent ) { + parent.selectedIndex; + // 确保这也适用于optgroup，见#5701 + if ( parent.parentNode ) { + parent.parentNode.selectedIndex; + } + } + return null; + } + }); + } +// IE6/7调用enctype编码 + if ( !jQuery.support.enctype ) { + jQuery.propFix.enctype = "encoding"; + } +// 单选按钮和复选框的获取/设置 + if ( !jQuery.support.checkOn ) { + jQuery.each([ "radio", "checkbox" ], function() { + jQuery.valHooks[ this ] = { + get: function( elem ) { + // 处理Webkit返回""而不是"on"的情况，如果没有指定值 + return elem.getAttribute("value") === null ? "on" : elem.value; + } + }; + }); + } + jQuery.each([ "radio", "checkbox" ], function() { + jQuery.valHooks[ this ] = jQuery.extend( jQuery.valHooks[ this ], { + set: function( elem, value ) { + if ( jQuery.isArray( value ) ) { + return ( elem.checked = jQuery.inArray( jQuery(elem).val(), value ) >= 0 ); + } + } + }); + }); -var rformElems = /^(?:textarea|input|select)$/i, - rtypenamespace = /^([^\.]*)?(?:\.(.+))?$/, - rhoverHack = /(?:^|\s)hover(\.\S+)?\b/, - rkeyEvent = /^key/, - rmouseEvent = /^(?:mouse|contextmenu)|click/, - rfocusMorph = /^(?:focusinfocus|focusoutblur)$/, - rquickIs = /^(\w*)(?:#([\w\-]+))?(?:\.([\w\-]+))?$/, - quickParse = function( selector ) { - var quick = rquickIs.exec( selector ); - if ( quick ) { - // 0 1 2 3 - // [ _, tag, id, class ] - quick[1] = ( quick[1] || "" ).toLowerCase(); - quick[3] = quick[3] && new RegExp( "(?:^|\\s)" + quick[3] + "(?:\\s|$)" ); - } - return quick; - }, - quickIs = function( elem, m ) { - var attrs = elem.attributes || {}; - return ( - (!m[1] || elem.nodeName.toLowerCase() === m[1]) && - (!m[2] || (attrs.id || {}).value === m[2]) && - (!m[3] || m[3].test( (attrs[ "class" ] || {}).value )) - ); - }, - hoverHack = function( events ) { - return jQuery.event.special.hover ? events : events.replace( rhoverHack, "mouseenter$1 mouseleave$1" ); - }; +// 定义用于匹配表单元素的正则表达式 + var rformElems = /^(?:textarea|input|select)$/i, + // 定义用于匹配命名空间的正则表达式 + rtypenamespace = /^([^\.]*)?(?:\.(.+))?$/, + // 定义用于处理hover事件hack的正则表达式 + rhoverHack = /(?:^|\s)hover(\.\S+)?\b/, + // 定义用于匹配键盘事件的正则表达式 + rkeyEvent = /^key/, + // 定义用于匹配鼠标事件的正则表达式 + rmouseEvent = /^(?:mouse|contextmenu)|click/, + // 定义用于匹配focus事件的正则表达式 + rfocusMorph = /^(?:focusinfocus|focusoutblur)$/, + // 定义用于快速解析选择器的正则表达式 + rquickIs = /^(\w*)(?:#([\w\-]+))?(?:\.([\w\-]+))?$/, + // 快速解析选择器的辅助函数 + quickParse = function( selector ) { + var quick = rquickIs.exec( selector ); + if ( quick ) { + // 0 1 2 3 + // [ _, tag, id, class ] + quick[1] = ( quick[1] || "" ).toLowerCase(); + quick[3] = quick[3] && new RegExp( "(?:^|\\s)" + quick[3] + "(?:\\s|$)" ); + } + return quick; + }, + // 快速检查元素是否匹配选择器的函数 + quickIs = function( elem, m ) { + var attrs = elem.attributes || {}; + return ( + (!m[1] || elem.nodeName.toLowerCase() === m[1]) && + (!m[2] || (attrs.id || {}).value === m[2]) && + (!m[3] || m[3].test( (attrs[ "class" ] || {}).value )) + ); + }, + // 处理hover事件hack的函数 + hoverHack = function( events ) { + return jQuery.event.special.hover ? events : events.replace( rhoverHack, "mouseenter$1 mouseleave$1" ); + }; -/* - * Helper functions for managing events -- not part of the public interface. - * Props to Dean Edwards' addEvent library for many of the ideas. - */ -jQuery.event = { + /* + * 事件管理的帮助函数——不是公共接口的一部分 + * 许多想法来自Dean Edwards' addEvent库。 + */ + jQuery.event = { - add: function( elem, types, handler, data, selector ) { + add: function( elem, types, handler, data, selector ) { - var elemData, eventHandle, events, - t, tns, type, namespaces, handleObj, - handleObjIn, quick, handlers, special; + var elemData, eventHandle, events, + t, tns, type, namespaces, handleObj, + handleObjIn, quick, handlers, special; - // Don't attach events to noData or text/comment nodes (allow plain objects tho) - if ( elem.nodeType === 3 || elem.nodeType === 8 || !types || !handler || !(elemData = jQuery._data( elem )) ) { - return; - } + // 不要为noData或文本/注释节点附加事件（允许纯对象） + if ( elem.nodeType === 3 || elem.nodeType === 8 || !types || !handler || !(elemData = jQuery._data( elem )) ) { + return; + } - // Caller can pass in an object of custom data in lieu of the handler - if ( handler.handler ) { - handleObjIn = handler; - handler = handleObjIn.handler; - selector = handleObjIn.selector; - } + // 调用者可以传入一个自定义数据对象代替处理器 + if ( handler.handler ) { + handleObjIn = handler; + handler = handleObjIn.handler; + selector = handleObjIn.selector; + } - // Make sure that the handler has a unique ID, used to find/remove it later - if ( !handler.guid ) { - handler.guid = jQuery.guid++; - } + // 确保处理器有一个唯一的ID，用于稍后查找/移除它 + if ( !handler.guid ) { + handler.guid = jQuery.guid++; + } - // Init the element's event structure and main handler, if this is the first - events = elemData.events; - if ( !events ) { - elemData.events = events = {}; - } - eventHandle = elemData.handle; - if ( !eventHandle ) { - elemData.handle = eventHandle = function( e ) { - // Discard the second event of a jQuery.event.trigger() and - // when an event is called after a page has unloaded - return typeof jQuery !== "undefined" && (!e || jQuery.event.triggered !== e.type) ? - jQuery.event.dispatch.apply( eventHandle.elem, arguments ) : - undefined; + // 初始化元素的事件结构和主处理器，如果这是第一个 + events = elemData.events; + if ( !events ) { + elemData.events = events = {}; + } + eventHandle = elemData.handle; + if ( !eventHandle ) { + elemData.handle = eventHandle = function( e ) { + // 丢弃jQuery.event.trigger()的第二个事件 +// 当一个页面卸载后调用事件 + return typeof jQuery !== "undefined" && (!e || jQuery.event.triggered !== e.type) ? + jQuery.event.dispatch.apply( eventHandle.elem, arguments ) : + undefined; + }; +// 将elem作为handle函数的属性添加，以防止IE非原生事件的内存泄漏 + eventHandle.elem = elem; + } + } }; - // Add elem as a property of the handle fn to prevent a memory leak with IE non-native events - eventHandle.elem = elem; - } // Handle multiple events separated by a space // jQuery(...).bind("mouseover mouseout", fn); - types = jQuery.trim( hoverHack(types) ).split( " " ); - for ( t = 0; t < types.length; t++ ) { - - tns = rtypenamespace.exec( types[t] ) || []; - type = tns[1]; - namespaces = ( tns[2] || "" ).split( "." ).sort(); - - // If event changes its type, use the special event handlers for the changed type - special = jQuery.event.special[ type ] || {}; - - // If selector defined, determine special event api type, otherwise given type - type = ( selector ? special.delegateType : special.bindType ) || type; - - // Update special based on newly reset type - special = jQuery.event.special[ type ] || {}; - - // handleObj is passed to all event handlers - handleObj = jQuery.extend({ - type: type, - origType: tns[1], - data: data, - handler: handler, - guid: handler.guid, - selector: selector, - quick: selector && quickParse( selector ), - namespace: namespaces.join(".") - }, handleObjIn ); - - // Init the event handler queue if we're the first - handlers = events[ type ]; - if ( !handlers ) { - handlers = events[ type ] = []; - handlers.delegateCount = 0; + // 将types字符串修剪并分割成数组 + types = jQuery.trim( hoverHack(types) ).split( " " ); + for ( t = 0; t < types.length; t++ ) { + + // 通过正则表达式获取事件类型和命名空间 + tns = rtypenamespace.exec( types[t] ) || []; + type = tns[1]; + namespaces = ( tns[2] || "" ).split( "." ).sort(); + + // 如果事件类型发生变化，使用变化后的类型的特定事件处理器 + special = jQuery.event.special[ type ] || {}; + + // 如果定义了选择器，确定特殊事件API类型，否则使用给定的类型 + type = ( selector ? special.delegateType : special.bindType ) || type; + + // 根据新重置的类型更新special + special = jQuery.event.special[ type ] || {}; + + // handleObj将被传递给所有事件处理器 + handleObj = jQuery.extend({ + type: type, + origType: tns[1], + data: data, + handler: handler, + guid: handler.guid, + selector: selector, + quick: selector && quickParse( selector ), + namespace: namespaces.join(".") + }, handleObjIn ); + + // 如果我们是第一个，初始化事件处理器队列 + handlers = events[ type ]; + if ( !handlers ) { + handlers = events[ type ] = []; + handlers.delegateCount = 0; + + // 只有当特殊事件处理器返回false时，才使用addEventListener/attachEvent + if ( !special.setup || special.setup.call( elem, data, namespaces, eventHandle ) === false ) { + // 将全局事件处理器绑定到元素上 + if ( elem.addEventListener ) { + elem.addEventListener( type, eventHandle, false ); + + } else if ( elem.attachEvent ) { + elem.attachEvent( "on" + type, eventHandle ); + } + } + } - // Only use addEventListener/attachEvent if the special events handler returns false - if ( !special.setup || special.setup.call( elem, data, namespaces, eventHandle ) === false ) { - // Bind the global event handler to the element - if ( elem.addEventListener ) { - elem.addEventListener( type, eventHandle, false ); + if ( special.add ) { + special.add.call( elem, handleObj ); - } else if ( elem.attachEvent ) { - elem.attachEvent( "on" + type, eventHandle ); + if ( !handleObj.handler.guid ) { + handleObj.handler.guid = handler.guid; } } - } - - if ( special.add ) { - special.add.call( elem, handleObj ); - if ( !handleObj.handler.guid ) { - handleObj.handler.guid = handler.guid; + // 添加到元素的处理器列表中，代表在前面 + if ( selector ) { + handlers.splice( handlers.delegateCount++, 0, handleObj ); + } else { + handlers.push( handleObj ); } - } - // Add to the element's handler list, delegates in front - if ( selector ) { - handlers.splice( handlers.delegateCount++, 0, handleObj ); - } else { - handlers.push( handleObj ); + // 跟踪哪些事件曾经被使用过，用于事件优化 + jQuery.event.global[ type ] = true; } - // Keep track of which events have ever been used, for event optimization - jQuery.event.global[ type ] = true; - } - - // Nullify elem to prevent memory leaks in IE - elem = null; - }, - - global: {}, +// 将elem置空以防止IE中的内存泄漏 + elem = null; + }, - // Detach an event or set of events from an element - remove: function( elem, types, handler, selector, mappedTypes ) { +// 从元素上移除一个或一组事件 + remove: function( elem, types, handler, selector, mappedTypes ) { - var elemData = jQuery.hasData( elem ) && jQuery._data( elem ), - t, tns, type, origType, namespaces, origCount, - j, events, special, handle, eventType, handleObj; + var elemData = jQuery.hasData( elem ) && jQuery._data( elem ), + t, tns, type, origType, namespaces, origCount, + j, events, special, handle, eventType, handleObj; - if ( !elemData || !(events = elemData.events) ) { - return; - } + if ( !elemData || !(events = elemData.events) ) { + return; + } - // Once for each type.namespace in types; type may be omitted - types = jQuery.trim( hoverHack( types || "" ) ).split(" "); - for ( t = 0; t < types.length; t++ ) { - tns = rtypenamespace.exec( types[t] ) || []; - type = origType = tns[1]; - namespaces = tns[2]; + // 为types的每个类型.namespace;类型可能被省略 + types = jQuery.trim( hoverHack( types || "" ) ).split(" "); + for ( t = 0; t < types.length; t++ ) { + tns = rtypenamespace.exec( types[t] ) || []; + type = origType = tns[1]; + namespaces = tns[2]; - // Unbind all events (on this namespace, if provided) for the element - if ( !type ) { - for ( type in events ) { - jQuery.event.remove( elem, type + types[ t ], handler, selector, true ); + // 如果没有类型，为元素解除所有事件（在此命名空间下，如果提供了） + if ( !type ) { + for ( type in events ) { + jQuery.event.remove( elem, type + types[ t ], handler, selector, true ); + } + continue; } - continue; - } - special = jQuery.event.special[ type ] || {}; - type = ( selector? special.delegateType : special.bindType ) || type; - eventType = events[ type ] || []; - origCount = eventType.length; - namespaces = namespaces ? new RegExp("(^|\\.)" + namespaces.split(".").sort().join("\\.(?:.*\\.)?") + "(\\.|$)") : null; + special = jQuery.event.special[ type ] || {}; + type = ( selector? special.delegateType : special.bindType ) || type; + eventType = events[ type ] || []; + origCount = eventType.length; + namespaces = namespaces ? new RegExp("(^|\\.)" + namespaces.split(".").sort().join("\\.(?:.*\\.)?") + "(\\.|$)") : null; - // Remove matching events - for ( j = 0; j < eventType.length; j++ ) { - handleObj = eventType[ j ]; + // 移除匹配的事件 + for ( j = 0; j < eventType.length; j++ ) { + handleObj = eventType[ j ]; - if ( ( mappedTypes || origType === handleObj.origType ) && - ( !handler || handler.guid === handleObj.guid ) && - ( !namespaces || namespaces.test( handleObj.namespace ) ) && - ( !selector || selector === handleObj.selector || selector === "**" && handleObj.selector ) ) { - eventType.splice( j--, 1 ); + if ( ( mappedTypes || origType === handleObj.origType ) && + ( !handler || handler.guid === handleObj.guid ) && + ( !namespaces || namespaces.test( handleObj.namespace ) ) && + ( !selector || selector === handleObj.selector || selector === "**" && handleObj.selector ) ) { + eventType.splice( j--, 1 ); - if ( handleObj.selector ) { - eventType.delegateCount--; + if ( handleObj.selector ) { + eventType.delegateCount--; + } + if ( special.remove ) { + special.remove.call( elem, handleObj ); + } } - if ( special.remove ) { - special.remove.call( elem, handleObj ); + } + + // 如果eventType被移除且没有更多处理器存在，则移除通用事件处理器 + // （避免在移除特殊事件处理器时出现潜在的无限递归） + if ( eventType.length === 0 && origCount !== eventType.length ) { + if ( !special.teardown || special.teardown.call( elem, namespaces ) === false ) { + jQuery.removeEvent( elem, type, elemData.handle ); } + + delete events[ type ]; } } - // Remove generic event handler if we removed something and no more handlers exist - // (avoids potential for endless recursion during removal of special event handlers) - if ( eventType.length === 0 && origCount !== eventType.length ) { - if ( !special.teardown || special.teardown.call( elem, namespaces ) === false ) { - jQuery.removeEvent( elem, type, elemData.handle ); + // 如果它不再被使用，则移除expando + if ( jQuery.isEmptyObject( events ) ) { + handle = elemData.handle; + if ( handle ) { + handle.elem = null; } - delete events[ type ]; + // removeData也检查空并清除expando如果为空 + // 因此使用它代替delete + jQuery.removeData( elem, [ "events", "handle" ], true ); } - } - - // Remove the expando if it's no longer used - if ( jQuery.isEmptyObject( events ) ) { - handle = elemData.handle; - if ( handle ) { - handle.elem = null; - } - - // removeData also checks for emptiness and clears the expando if empty - // so use it instead of delete - jQuery.removeData( elem, [ "events", "handle" ], true ); - } - }, + }, - // Events that are safe to short-circuit if no handlers are attached. - // Native DOM events should not be added, they may have inline handlers. - customEvent: { - "getData": true, - "setData": true, - "changeData": true - }, +// 如果没有附加处理器，则可以安全地短路的事件。 +// 原生DOM事件不应被添加，它们可能有内联处理器。 + customEvent: { + "getData": true, + "setData": true, + "changeData": true + }, - trigger: function( event, data, elem, onlyHandlers ) { - // Don't do events on text and comment nodes - if ( elem && (elem.nodeType === 3 || elem.nodeType === 8) ) { - return; - } +// 触发事件 + trigger: function( event, data, elem, onlyHandlers ) { + // 不要在文本和注释节点上做事件 + if ( elem && (elem.nodeType === 3 || elem.nodeType === 8) ) { + return; + } - // Event object or event type - var type = event.type || event, - namespaces = [], - cache, exclusive, i, cur, old, ontype, special, handle, eventPath, bubbleType; + // 事件对象或事件类型 + var type = event.type || event, + namespaces = [], + cache, exclusive, i, cur, old, ontype, special, handle, eventPath, bubbleType; - // focus/blur morphs to focusin/out; ensure we're not firing them right now - if ( rfocusMorph.test( type + jQuery.event.triggered ) ) { - return; - } + // focus/blur变为focusin/out；确保我们不是在现在触发它们 + if ( rfocusMorph.test( type + jQuery.event.triggered ) ) { + return; + } - if ( type.indexOf( "!" ) >= 0 ) { - // Exclusive events trigger only for the exact event (no namespaces) - type = type.slice(0, -1); - exclusive = true; - } + if ( type.indexOf( "!" ) >= 0 ) { + // 独家事件只触发确切的事件（无命名空间） + type = type.slice(0, -1); + exclusive = true; + } - if ( type.indexOf( "." ) >= 0 ) { - // Namespaced trigger; create a regexp to match event type in handle() - namespaces = type.split("."); - type = namespaces.shift(); - namespaces.sort(); - } + if ( type.indexOf( "." ) >= 0 ) { + // 命名空间触发；创建一个正则表达式来匹配handle()中的事件类型 + namespaces = type.split("."); + type = namespaces.shift(); + namespaces.sort(); + } - if ( (!elem || jQuery.event.customEvent[ type ]) && !jQuery.event.global[ type ] ) { - // No jQuery handlers for this event type, and it can't have inline handlers - return; - } + if ( (!elem || jQuery.event.customEvent[ type ]) && !jQuery.event.global[ type ] ) { + // 没有jQuery处理器用于此事件类型，它不能有内联处理器 + return; + } - // Caller can pass in an Event, Object, or just an event type string - event = typeof event === "object" ? - // jQuery.Event object - event[ jQuery.expando ] ? event : - // Object literal - new jQuery.Event( type, event ) : - // Just the event type (string) - new jQuery.Event( type ); + // 调用者可以传入一个Event对象、对象或只是一个事件类型字符串 + event = typeof event === "object" ? + // jQuery.Event对象 + event[ jQuery.expando ] ? event : + // 对象字面量 + new jQuery.Event( type, event ) : + // 只是事件类型（字符串） + new jQuery.Event( type ); - event.type = type; - event.isTrigger = true; - event.exclusive = exclusive; - event.namespace = namespaces.join( "." ); - event.namespace_re = event.namespace? new RegExp("(^|\\.)" + namespaces.join("\\.(?:.*\\.)?") + "(\\.|$)") : null; - ontype = type.indexOf( ":" ) < 0 ? "on" + type : ""; + event.type = type; + event.isTrigger = true; + event.exclusive = exclusive; + event.namespace = namespaces.join( "." ); + event.namespace_re = event.namespace? new RegExp("(^|\\.)" + namespaces.join("\\.(?:.*\\.)?") + "(\\.|$)") : null; + ontype = type.indexOf( ":" ) < 0 ? "on" + type : ""; - // Handle a global trigger - if ( !elem ) { + // 处理全局触发 + if ( !elem ) { - // TODO: Stop taunting the data cache; remove global events and always attach to document - cache = jQuery.cache; - for ( i in cache ) { - if ( cache[ i ].events && cache[ i ].events[ type ] ) { - jQuery.event.trigger( event, data, cache[ i ].handle.elem, true ); + // TODO: 停止嘲笑数据缓存；移除全局事件并总是附加到文档 + cache = jQuery.cache; + for ( i in cache ) { + if ( cache[ i ].events && cache[ i ].events[ type ] ) { + jQuery.event.trigger( event, data, cache[ i ].handle.elem, true ); + } } + return; } - return; - } - // Clean up the event in case it is being reused - event.result = undefined; - if ( !event.target ) { - event.target = elem; - } + // 清理事件以防它被重用 + event.result = undefined; + if ( !event.target ) { + event.target = elem; + } - // Clone any incoming data and prepend the event, creating the handler arg list - data = data != null ? jQuery.makeArray( data ) : []; - data.unshift( event ); + // 克隆任何传入的数据并在前面添加事件，创建处理器参数列表 + data = data != null ? jQuery.makeArray( data ) : []; + data.unshift( event ); - // Allow special events to draw outside the lines - special = jQuery.event.special[ type ] || {}; - if ( special.trigger && special.trigger.apply( elem, data ) === false ) { - return; - } + // 允许特殊事件超越常规 + special = jQuery.event.special[ type ] || {}; + if ( special.trigger && special.trigger.apply( elem, data ) === false ) { + return; + } - // Determine event propagation path in advance, per W3C events spec (#9951) - // Bubble up to document, then to window; watch for a global ownerDocument var (#9724) - eventPath = [[ elem, special.bindType || type ]]; - if ( !onlyHandlers && !special.noBubble && !jQuery.isWindow( elem ) ) { + // 根据W3C事件规范预先确定事件传播路径 + // 冒泡到文档，然后到窗口；注意全局ownerDocument变量（#9724） + eventPath = [[ elem, special.bindType || type ]]; - bubbleType = special.delegateType || type; - cur = rfocusMorph.test( bubbleType + type ) ? elem : elem.parentNode; - old = null; - for ( ; cur; cur = cur.parentNode ) { - eventPath.push([ cur, bubbleType ]); - old = cur; - } + if ( !only Handlers && !special.noBubble && !jQuery.isWindow( elem ) ) { + bubbleType = special.delegateType || type; + cur = rfocusMorph.test( bubbleType + type ) ? elem : elem.parentNode; + old = null; + for ( ; cur; cur = cur.parentNode ) { + eventPath.push([ cur, bubbleType ]); + old = cur; + } - // Only add window if we got to document (e.g., not plain obj or detached DOM) - if ( old && old === elem.ownerDocument ) { - eventPath.push([ old.defaultView || old.parentWindow || window, bubbleType ]); + // 只有在到达文档时才添加窗口（例如，不是普通对象或脱离DOM） + if ( old && old === elem.ownerDocument ) { + eventPath.push([ old.defaultView || old.parentWindow || window, bubbleType ]); + } } - } - // Fire handlers on the event path - for ( i = 0; i < eventPath.length && !event.isPropagationStopped(); i++ ) { +// 在事件路径上触发处理器 + for ( i = 0; i < eventPath.length && !event.isPropagationStopped(); i++ ) { - cur = eventPath[i][0]; - event.type = eventPath[i][1]; + cur = eventPath[i][0]; + event.type = eventPath[i][1]; - handle = ( jQuery._data( cur, "events" ) || {} )[ event.type ] && jQuery._data( cur, "handle" ); - if ( handle ) { - handle.apply( cur, data ); - } - // Note that this is a bare JS function and not a jQuery handler - handle = ontype && cur[ ontype ]; - if ( handle && jQuery.acceptData( cur ) && handle.apply( cur, data ) === false ) { - event.preventDefault(); + handle = ( jQuery._data( cur, "events" ) || {} )[ event.type ] && jQuery._data( cur, "handle" ); + if ( handle ) { + handle.apply( cur, data ); + } + // 注意这是一个裸JS函数而不是jQuery处理器 + handle = ontype && cur[ ontype ]; + if ( handle && jQuery.acceptData( cur ) && handle.apply( cur, data ) === false ) { + event.preventDefault(); + } } - } - event.type = type; + event.type = type; // If nobody prevented the default action, do it now if ( !onlyHandlers && !event.isDefaultPrevented() ) { @@ -3251,375 +3300,338 @@ jQuery.event = { return event.result; }, - dispatch: function( event ) { + // dispatch 函数负责触发事件，并执行相应的事件处理程序 + dispatch: function( event ) { - // Make a writable jQuery.Event from the native event object - event = jQuery.event.fix( event || window.event ); + // 将原生事件对象转换为可写的 jQuery.Event 对象 + event = jQuery.event.fix( event || window.event ); - var handlers = ( (jQuery._data( this, "events" ) || {} )[ event.type ] || []), - delegateCount = handlers.delegateCount, - args = [].slice.call( arguments, 0 ), - run_all = !event.exclusive && !event.namespace, - special = jQuery.event.special[ event.type ] || {}, - handlerQueue = [], - i, j, cur, jqcur, ret, selMatch, matched, matches, handleObj, sel, related; + // 获取与事件类型相关联的处理程序数组 + var handlers = ( (jQuery._data( this, "events" ) || {} )[ event.type ] || []), + delegateCount = handlers.delegateCount, + args = [].slice.call( arguments, 0 ), + run_all = !event.exclusive && !event.namespace, + special = jQuery.event.special[ event.type ] || {}, + handlerQueue = [], + i, j, cur, jqcur, ret, selMatch, matched, matches, handleObj, sel, related; - // Use the fix-ed jQuery.Event rather than the (read-only) native event - args[0] = event; - event.delegateTarget = this; + // 用修正后的 jQuery.Event 替换原生事件对象 + args[0] = event; + event.delegateTarget = this; - // Call the preDispatch hook for the mapped type, and let it bail if desired - if ( special.preDispatch && special.preDispatch.call( this, event ) === false ) { - return; - } + // 调用映射类型的 preDispatch 钩子，如果需要可以终止事件 + if ( special.preDispatch && special.preDispatch.call( this, event ) === false ) { + return; + } - // Determine handlers that should run if there are delegated events - // Avoid non-left-click bubbling in Firefox (#3861) - if ( delegateCount && !(event.button && event.type === "click") ) { + // 确定如果有委托事件应该运行的处理程序 + if ( delegateCount && !(event.button && event.type === "click") ) { - // Pregenerate a single jQuery object for reuse with .is() - jqcur = jQuery(this); - jqcur.context = this.ownerDocument || this; + // 为 .is() 重用预生成的单个 jQuery 对象 + jqcur = jQuery(this); + jqcur.context = this.ownerDocument || this; - for ( cur = event.target; cur != this; cur = cur.parentNode || this ) { + for ( cur = event.target; cur != this; cur = cur.parentNode || this ) { - // Don't process events on disabled elements (#6911, #8165) - if ( cur.disabled !== true ) { - selMatch = {}; - matches = []; - jqcur[0] = cur; - for ( i = 0; i < delegateCount; i++ ) { - handleObj = handlers[ i ]; - sel = handleObj.selector; + // 不处理禁用元素上的事件（#6911, #8165） + if ( cur.disabled !== true ) { + selMatch = {}; + matches = []; + jqcur[0] = cur; + for ( i = 0; i < delegateCount; i++ ) { + handleObj = handlers[ i ]; + sel = handleObj.selector; - if ( selMatch[ sel ] === undefined ) { - selMatch[ sel ] = ( - handleObj.quick ? quickIs( cur, handleObj.quick ) : jqcur.is( sel ) - ); + if ( selMatch[ sel ] === undefined ) { + selMatch[ sel ] = ( + handleObj.quick ? quickIs( cur, handleObj.quick ) : jqcur.is( sel ) + ); + } + if ( selMatch[ sel ] ) { + matches.push( handleObj ); + } } - if ( selMatch[ sel ] ) { - matches.push( handleObj ); + if ( matches.length ) { + handlerQueue.push({ elem: cur, matches: matches }); } } - if ( matches.length ) { - handlerQueue.push({ elem: cur, matches: matches }); - } } } - } - // Add the remaining (directly-bound) handlers - if ( handlers.length > delegateCount ) { - handlerQueue.push({ elem: this, matches: handlers.slice( delegateCount ) }); - } + // 添加剩余的（直接绑定的）处理程序 + if ( handlers.length > delegateCount ) { + handlerQueue.push({ elem: this, matches: handlers.slice( delegateCount ) }); + } - // Run delegates first; they may want to stop propagation beneath us - for ( i = 0; i < handlerQueue.length && !event.isPropagationStopped(); i++ ) { - matched = handlerQueue[ i ]; - event.currentTarget = matched.elem; + // 首先运行委托；它们可能希望停止我们的传播 + for ( i = 0; i < handlerQueue.length && !event.isPropagationStopped(); i++ ) { + matched = handlerQueue[ i ]; + event.currentTarget = matched.elem; - for ( j = 0; j < matched.matches.length && !event.isImmediatePropagationStopped(); j++ ) { - handleObj = matched.matches[ j ]; + for ( j = 0; j < matched.matches.length && !event.isImmediatePropagationStopped(); j++ ) { + handleObj = matched.matches[ j ]; - // Triggered event must either 1) be non-exclusive and have no namespace, or - // 2) have namespace(s) a subset or equal to those in the bound event (both can have no namespace). - if ( run_all || (!event.namespace && !handleObj.namespace) || event.namespace_re && event.namespace_re.test( handleObj.namespace ) ) { + if ( run_all || (!event.namespace && !handleObj.namespace) || event.namespace_re && event.namespace_re.test( handleObj.namespace ) ) { - event.data = handleObj.data; - event.handleObj = handleObj; + event.data = handleObj.data; + event.handleObj = handleObj; - ret = ( (jQuery.event.special[ handleObj.origType ] || {}).handle || handleObj.handler ) + ret = ( (jQuery.event.special[ handleObj.origType ] || {}).handle || handleObj.handler ) .apply( matched.elem, args ); - if ( ret !== undefined ) { - event.result = ret; - if ( ret === false ) { - event.preventDefault(); - event.stopPropagation(); + if ( ret !== undefined ) { + event.result = ret; + if ( ret === false ) { + event.preventDefault(); + event.stopPropagation(); + } } } } } - } - - // Call the postDispatch hook for the mapped type - if ( special.postDispatch ) { - special.postDispatch.call( this, event ); - } - return event.result; - }, + // 调用映射类型的 postDispatch 钩子 + if ( special.postDispatch ) { + special.postDispatch.call( this, event ); + } - // Includes some event props shared by KeyEvent and MouseEvent - // *** attrChange attrName relatedNode srcElement are not normalized, non-W3C, deprecated, will be removed in 1.8 *** - props: "attrChange attrName relatedNode srcElement altKey bubbles cancelable ctrlKey currentTarget eventPhase metaKey relatedTarget shiftKey target timeStamp view which".split(" "), + return event.result; + }, - fixHooks: {}, +// 包括一些 KeyEvent 和 MouseEvent 共享的事件属性 + props: "attrChange attrName relatedNode srcElement altKey bubbles cancelable ctrlKey currentTarget eventPhase metaKey relatedTarget shiftKey target timeStamp view which".split(" "), - keyHooks: { - props: "char charCode key keyCode".split(" "), - filter: function( event, original ) { + fixHooks: {}, - // Add which for key events - if ( event.which == null ) { - event.which = original.charCode != null ? original.charCode : original.keyCode; +// 处理键盘事件的钩子 + keyHooks: { + props: "char charCode key keyCode".split(" "), + filter: function( event, original ) { + if ( event.which == null ) { + event.which = original.charCode != null ? original.charCode : original.keyCode; + } + return event; } + }, - return event; - } - }, +// 处理鼠标事件的钩子 + mouseHooks: { + props: "button buttons clientX clientY fromElement offsetX offsetY pageX pageY screenX screenY toElement".split(" "), + filter: function( event, original ) { + var eventDoc, doc, body, + button = original.button, + fromElement = original.fromElement; - mouseHooks: { - props: "button buttons clientX clientY fromElement offsetX offsetY pageX pageY screenX screenY toElement".split(" "), - filter: function( event, original ) { - var eventDoc, doc, body, - button = original.button, - fromElement = original.fromElement; + if ( event.pageX == null && original.clientX != null ) { + eventDoc = event.target.ownerDocument || document; + doc = eventDoc.documentElement; + body = eventDoc.body; - // Calculate pageX/Y if missing and clientX/Y available - if ( event.pageX == null && original.clientX != null ) { - eventDoc = event.target.ownerDocument || document; - doc = eventDoc.documentElement; - body = eventDoc.body; + event.pageX = original.clientX + ( doc && doc.scrollLeft || body && body.scrollLeft || 0 ) - ( doc && doc.clientLeft || body && body.clientLeft || 0 ); + event.pageY = original.clientY + ( doc && doc.scrollTop || body && body.scrollTop || 0 ) - ( doc && doc.clientTop || body && body.clientTop || 0 ); + } - event.pageX = original.clientX + ( doc && doc.scrollLeft || body && body.scrollLeft || 0 ) - ( doc && doc.clientLeft || body && body.clientLeft || 0 ); - event.pageY = original.clientY + ( doc && doc.scrollTop || body && body.scrollTop || 0 ) - ( doc && doc.clientTop || body && body.clientTop || 0 ); - } + if ( !event.relatedTarget && fromElement ) { + event.relatedTarget = fromElement === event.target ? original.toElement : fromElement; + } - // Add relatedTarget, if necessary - if ( !event.relatedTarget && fromElement ) { - event.relatedTarget = fromElement === event.target ? original.toElement : fromElement; + if ( !event.which && button !== undefined ) { + event.which = ( button & 1 ? 1 : ( button & 2 ? 3 : ( button & 4 ? 2 : 0 ) ) ); + } + return event; } + }, - // Add which for click: 1 === left; 2 === middle; 3 === right - // Note: button is not normalized, so don't use it - if ( !event.which && button !== undefined ) { - event.which = ( button & 1 ? 1 : ( button & 2 ? 3 : ( button & 4 ? 2 : 0 ) ) ); +// 修正事件对象的函数 + fix: function( event ) { + if ( event[ jQuery.expando ] ) { + return event; } - return event; - } - }, - - fix: function( event ) { - if ( event[ jQuery.expando ] ) { - return event; - } - - // Create a writable copy of the event object and normalize some properties - var i, prop, - originalEvent = event, - fixHook = jQuery.event.fixHooks[ event.type ] || {}, - copy = fixHook.props ? this.props.concat( fixHook.props ) : this.props; - - event = jQuery.Event( originalEvent ); + var i, prop, + originalEvent = event, + fixHook = jQuery.event.fixHooks[ event.type ] || {}, + copy = fixHook.props ? this.props.concat( fixHook.props ) : this.props; - for ( i = copy.length; i; ) { - prop = copy[ --i ]; - event[ prop ] = originalEvent[ prop ]; - } + event = jQuery.Event( originalEvent ); - // Fix target property, if necessary (#1925, IE 6/7/8 & Safari2) - if ( !event.target ) { - event.target = originalEvent.srcElement || document; - } + for ( i = copy.length; i; ) { + prop = copy[ --i ]; + event[ prop ] = originalEvent[ prop ]; + } - // Target should not be a text node (#504, Safari) - if ( event.target.nodeType === 3 ) { - event.target = event.target.parentNode; - } + if ( !event.target ) { + event.target = originalEvent.srcElement || document; + } - // For mouse/key events; add metaKey if it's not there (#3368, IE6/7/8) - if ( event.metaKey === undefined ) { - event.metaKey = event.ctrlKey; - } + if ( event.target.nodeType === 3 ) { + event.target = event.target.parentNode; + } - return fixHook.filter? fixHook.filter( event, originalEvent ) : event; - }, + if ( event.metaKey === undefined ) { + event.metaKey = event.ctrlKey; + } - special: { - ready: { - // Make sure the ready event is setup - setup: jQuery.bindReady + return fixHook.filter? fixHook.filter( event, originalEvent ) : event; }, - load: { - // Prevent triggered image.load events from bubbling to window.load - noBubble: true +// 特殊事件的处理 + special: { + ready: { + setup: jQuery.bindReady + }, + load: { + noBubble: true + }, + focus: { + delegateType: "focusin" + }, + blur: { + delegateType: "focusout" + }, + beforeunload: { + setup: function( data, namespaces, eventHandle ) { + if ( jQuery.isWindow( this ) ) { + this.onbeforeunload = eventHandle; + } + }, + teardown: function( namespaces, eventHandle ) { + if ( this.onbeforeunload === eventHandle ) { + this.onbeforeunload = null; + } + } + } }, - focus: { - delegateType: "focusin" - }, - blur: { - delegateType: "focusout" +// 模拟事件的函数 + simulate: function( type, elem, event, bubble ) { + var e = jQuery.extend( + new jQuery.Event(), + event, + { type: type, + isSimulated: true, + originalEvent: {} + } + ); + if ( bubble ) { + jQuery.event.trigger( e, null, elem ); + } else { + jQuery.event.dispatch.call( elem, e ); + } + if ( e.isDefaultPrevented() ) { + event.preventDefault(); + } }, - beforeunload: { - setup: function( data, namespaces, eventHandle ) { - // We only want to do this special case on windows - if ( jQuery.isWindow( this ) ) { - this.onbeforeunload = eventHandle; - } - }, +// 处理事件的脱绑和绑定 + jQuery.event.handle = jQuery.event.dispatch; - teardown: function( namespaces, eventHandle ) { - if ( this.onbeforeunload === eventHandle ) { - this.onbeforeunload = null; + jQuery.removeEvent = document.removeEventListener ? + function( elem, type, handle ) { + if ( elem.removeEventListener ) { + elem.removeEventListener( type, handle, false ); } - } - } - }, + } : + function( elem, type, handle ) { + if ( elem.detachEvent ) { + elem.detachEvent( "on" + type, handle ); + } + }; - simulate: function( type, elem, event, bubble ) { - // Piggyback on a donor event to simulate a different one. - // Fake originalEvent to avoid donor's stopPropagation, but if the - // simulated event prevents default then we do the same on the donor. - var e = jQuery.extend( - new jQuery.Event(), - event, - { type: type, - isSimulated: true, - originalEvent: {} +// jQuery.Event 构造函数 + jQuery.Event = function( src, props ) { + if ( !(this instanceof jQuery.Event) ) { + return new jQuery.Event( src, props ); } - ); - if ( bubble ) { - jQuery.event.trigger( e, null, elem ); - } else { - jQuery.event.dispatch.call( elem, e ); - } - if ( e.isDefaultPrevented() ) { - event.preventDefault(); - } - } -}; - -// Some plugins are using, but it's undocumented/deprecated and will be removed. -// The 1.7 special event interface should provide all the hooks needed now. -jQuery.event.handle = jQuery.event.dispatch; - -jQuery.removeEvent = document.removeEventListener ? - function( elem, type, handle ) { - if ( elem.removeEventListener ) { - elem.removeEventListener( type, handle, false ); - } - } : - function( elem, type, handle ) { - if ( elem.detachEvent ) { - elem.detachEvent( "on" + type, handle ); - } - }; -jQuery.Event = function( src, props ) { - // Allow instantiation without the 'new' keyword - if ( !(this instanceof jQuery.Event) ) { - return new jQuery.Event( src, props ); - } + if ( src && src.type ) { + this.originalEvent = src; + this.type = src.type; + this.isDefaultPrevented = ( src.defaultPrevented || src.returnValue === false || + src.getPreventDefault && src.getPreventDefault() ) ? returnTrue : returnFalse; + } else { + this.type = src; + } - // Event object - if ( src && src.type ) { - this.originalEvent = src; - this.type = src.type; + if ( props ) { + jQuery.extend( this, props ); + } - // Events bubbling up the document may have been marked as prevented - // by a handler lower down the tree; reflect the correct value. - this.isDefaultPrevented = ( src.defaultPrevented || src.returnValue === false || - src.getPreventDefault && src.getPreventDefault() ) ? returnTrue : returnFalse; + this.timeStamp = src && src.timeStamp || jQuery.now(); + this[ jQuery.expando ] = true; + }; - // Event type - } else { - this.type = src; + function returnFalse() { + return false; } - - // Put explicitly provided properties onto the event object - if ( props ) { - jQuery.extend( this, props ); + function returnTrue() { + return true; } - // Create a timestamp if incoming event doesn't have one - this.timeStamp = src && src.timeStamp || jQuery.now(); - - // Mark it as fixed - this[ jQuery.expando ] = true; -}; - -function returnFalse() { - return false; -} -function returnTrue() { - return true; -} - -// jQuery.Event is based on DOM3 Events as specified by the ECMAScript Language Binding -// http://www.w3.org/TR/2003/WD-DOM-Level-3-Events-20030331/ecma-script-binding.html -jQuery.Event.prototype = { - preventDefault: function() { - this.isDefaultPrevented = returnTrue; +// jQuery.Event 原型，提供 preventDefault, stopPropagation 等方法 + jQuery.Event.prototype = { + preventDefault: function() { + this.isDefaultPrevented = returnTrue; - var e = this.originalEvent; - if ( !e ) { - return; - } - - // if preventDefault exists run it on the original event - if ( e.preventDefault ) { - e.preventDefault(); - - // otherwise set the returnValue property of the original event to false (IE) - } else { - e.returnValue = false; - } - }, - stopPropagation: function() { - this.isPropagationStopped = returnTrue; + var e = this.originalEvent; + if ( !e ) { + return; + } - var e = this.originalEvent; - if ( !e ) { - return; - } - // if stopPropagation exists run it on the original event - if ( e.stopPropagation ) { - e.stopPropagation(); - } - // otherwise set the cancelBubble property of the original event to true (IE) - e.cancelBubble = true; - }, - stopImmediatePropagation: function() { - this.isImmediatePropagationStopped = returnTrue; - this.stopPropagation(); - }, - isDefaultPrevented: returnFalse, - isPropagationStopped: returnFalse, - isImmediatePropagationStopped: returnFalse -}; + // if preventDefault exists run it on the original event + if ( e.preventDefault ) { + e.preventDefault(); -// Create mouseenter/leave events using mouseover/out and event-time checks -jQuery.each({ - mouseenter: "mouseover", - mouseleave: "mouseout" -}, function( orig, fix ) { - jQuery.event.special[ orig ] = { - delegateType: fix, - bindType: fix, + // otherwise set the returnValue property of the original event to false (IE) + } else { + e.returnValue = false; + } + }, + stopPropagation: function() { + this.isPropagationStopped = returnTrue; - handle: function( event ) { - var target = this, - related = event.relatedTarget, - handleObj = event.handleObj, - selector = handleObj.selector, - ret; - - // For mousenter/leave call the handler if related is outside the target. - // NB: No relatedTarget if the mouse left/entered the browser window - if ( !related || (related !== target && !jQuery.contains( target, related )) ) { - event.type = handleObj.origType; - ret = handleObj.handler.apply( this, arguments ); - event.type = fix; + var e = this.originalEvent; + if ( !e ) { + return; } - return ret; - } + // if stopPropagation exists run it on the original event + if ( e.stopPropagation ) { + e.stopPropagation(); + } + // otherwise set the cancelBubble property of the original event to true (IE) + e.cancelBubble = true; + }, + stopImmediatePropagation: function() { + this.isImmediatePropagationStopped = returnTrue; + this.stopPropagation(); + }, + isDefaultPrevented: returnFalse, + isPropagationStopped: returnFalse, + isImmediatePropagationStopped: returnFalse }; -}); +// 创建 mouseenter/leave 事件 + jQuery.each({ + mouseenter: "mouseover", + mouseleave: "mouseout" + }, function( orig, fix ) { + jQuery.event.special[ orig ] = { + delegateType: fix, + bindType: fix, + handle: function( event ) { + var target = this, + related = event.relatedTarget, + handleObj = event.handleObj, + selector = handleObj.selector, + ret; + if ( !related || (related !== target && !jQuery.contains( target, related )) ) { + event.type = handleObj.origType; + ret = handleObj.handler.apply( this, arguments ); + event.type = fix; + } + return ret; + } + }; + }); // IE submit delegation if ( !jQuery.support.submitBubbles ) {