第7章 jQuery应用Web程序设计（ASP.Net）.ppt

【案例7.3】广告图片轮显 在网站根文件夹下建文件夹js，把准备好的jQuery文件放入其中。 在网页文档的head部分引入jQuery。 初始化jQuery插件easyslide。 给图片轮显设计样式。 * 【案例7.3】广告图片轮显 在网站根文件夹下建文件夹js，把准备好的jQuery文件放入其中。 在网页文档的head部分引入jQuery。 初始化jQuery插件easyslide。 * 【案例7.3】广告图片轮显 给图片轮显设计样式。 * 【案例7.3】广告图片轮显 运行Default.aspx页面，4张图片依次轮换显示。 * 7.6.3 图片放大器 在淘宝网上有哪些信誉好的足球投注网站商品时有哪些信誉好的足球投注网站到的结果中提供的是缩略图，当鼠标放到商品缩略图上时就显示了较大的图片，使商品浏览起来更加清晰。这就是一种简单的图片放大镜效果，通过jQuery插件jqzoom可以实现这个功能。 【案例7.4】图片放大器 在网站根目录下新建文件夹images、css，images用于存放原图和缩略图，css用于存放关于图片放大镜的样式文件。 新建网页Default.aspx，在页面放入一个div，在div中设置缩略图和原图。通过a设置原图，通过img加载缩略图。 * 【案例7.4】图片放大器 在网站根文件夹下建文件夹js，把准备好的jQuery文件放入其中。在网页文档的head部分引入jQuery和样式文件。 script src=js/jquery-1.8.3.min.js type=text/javascript/script script src=js/jqzoom.pack.1.0.1.js type=text/javascript/script link rel=stylesheet href=css/jqzoom.css type=text/css/ 初始化jQuery插件jqzoom，以便运行网页后实现图片放大镜效果。 * 【案例7.4】图片放大器 运行Default.aspx页面，通过img加载缩略图，当鼠标在缩略图的某个位置时，就会将该位置的原图显示出来，从而实现局部放大功能。 * 7.6.4 网页软键盘 随着网络的普及，在网络上进行交易已经逐渐被人们所接受。很多系统在登录时都提供了一个虚拟的网页键盘，避免通过真实键盘输入，从而增强了安全性，防止黑客攻击。 通过jQuery插件keypad可以实现这个功能。 【案例7.5】网页软键盘 在网站根目录下新建文件夹css，存放关于网页软键盘的样式文件。 新建网页Default.aspx，在页面放入一个3行2列的表格用于布局。 * 【案例7.5】网页软键盘 在网站根文件夹下建文件夹js，把准备好的jQuery文件放入其中。 在网页文档的head部分引入样式文件和jQuery文件。 link href=css/keypad.css rel=stylesheet type=text/css / script type=text/javascript src=js/jquery.1.3.2.min.js/script script type=text/javascript src=js/jquery.keypad.js/script 初始化jQuery插件keypad，设置相关属性，使虚拟键盘中显示字母、字符和数字，以便用户能够选择。 * 【案例7.5】网页软键盘 在后台代码中创建一个getvalue()，用于返回虚拟键盘中选择的值。 在“登录”按钮的click事件中获取输入的用户名和密码，其中的密码通过getvalue()方法获取。 * 【案例7.5】网页软键盘 * 【案例7.5】网页软键盘 运行Default.aspx页面，获取用户名和通过软键盘输入的密码，弹出对话框显示输入的用户名和密码，在实际开发中可以将这些数据插入到数据库中。 * 选择版本的原则一般是越新越好，jQuery版本是在不断进步和发展的，必威体育精装版版是当时最高技术水平，也是最先进的技术理念。本章出于讲解的需要主要使用jQuery -1.8.3。 * * * * * 在上述代码中，如果使用的是clone(true)方法，那么单击被复制的新图片时，由于它具有原图片的事务处理，因此，将在这个复制的图片的右侧出现一幅通过其复制的新图片；如果使用 clone() 方法，那么只有单击原图片才可以复制新的图片元素，新复制的图片元素不具有任何功能。 * 7.3.4 jQuery内容过滤选择器 :contains(text) :contains(text)选取含有文本内容为“text”的元素，返回集合元素。 例：选取包含jQuery文本的dd元素，将字体颜色设为红色。 $(document).ready(function () { $(