【jQuery入门】教程文章相关的互联网学习教程文章

Jquery树插件zTree用法入门教程【图】

本文实例分析了Jquery树插件zTree用法。分享给大家供大家参考。具体分析如下: 关于zTree的介绍就搜吧。 这个例子的最终效果如下:鼠标移动到一级目录时出现全选链接,点击全选链接该目录下的所有子项都被添加到收件人的文本框中,当然点击单个子项则添加一个。至于要添加些什么信息由自己决定。 1. 下载zTee,页面引入jquery.js,根据功能需求添加zTree相应的js和css代码如下:<script type="text/javascript" src="js/jquery-1.4....

jQuery入门介绍之基础知识【图】

JavaScript 库作用及对比 为了简化JavaScript 的开发, 一些 JavsScript 库诞生了. JavaScript 库封装了很多预定义的对象和实用函数。能帮助使用者建立有高难度交互的Web2.0 特性的富客户端页面, 并且兼容各大浏览器 当前流行的JavaScript 库有: jQuery 简介 jQuery 是继 Prototype 之后又一个优秀的 JavaScript 库 jQuery 理念: 写得少, 做得多. 优势如下: 轻量级 强大的选择器 出色的 DOM 操作的封装 可靠的事件处理机制 完善的...

jQuery基础语法实例入门

本文实例讲述了jQuery基础语法。分享给大家供大家参考。具体分析如下: 此语法规则有两个部分组成:获取jQuery对象和对jQuery对象执行的操作。代码如下:$(selector).action() 下面就对以上语法规则进行详细的阐述: 1.$定义jQuery,将被选的DOM对象转换成jQuery对象。 2.selector是选择器,类似于CSS选择器。 3.action()是要对jQuery对象行的操作。 注: $是jQuery的简写。例如:代码如下:$("div") 也可以写成以下方式,不过我们习惯上...

jquery入门必备的基本认识及实例(整理)

1.Juqery是javascript的优秀框架。它是轻量级的js库,它兼容CSS3,还兼容各种浏览器(IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+),jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代...

JQuery入门——用映射方式绑定不同事件应用示例【图】

1、通过映射的方式,给对象绑定多个事件。 2、示例代码: 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>映射方式绑定不同事件</title> <script type="text/javascript" src="jquery-1.8.3.min.js"><...

JQuery入门——用bind方法绑定事件处理函数应用介绍【图】

1、bind()功能是为每个选择元素的事件绑定处理函数,其语法如下:bind(type, [data], fn) 其中type为一个或多个类型的字符串,如click或change,也可以自定义;可以被type调用的类型包括blur、focus、load、resize、scroll、unload、click、dbclick、mousedown等事件。参数data是作为event.data属性值传递对象的额外数据对象。参数fn是绑定到每个选择元素的事件中的处理函数。 2、示例代码: 代码如下:<!DOCTYPE html PUBLIC "-//W...

JQuery入门——用one()方法绑定事件处理函数(仅触发一次)【图】

1、one()方法功能是为所选的元素绑定一个仅触发一次的处理函数,其调用的语法格式为:one(type, [data], fn) 其中参数type为事件类型,即需要触发什么类型的事件;参数data为可选参数,表示作为event.data属性值传递给事件对象的额外数据对象;fn为绑定事件时所要触发的函数。 2、示例代码: 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"...

JQuery入门——移除绑定事件unbind方法概述及应用【图】

1、在DOM对象的实践操作中,既然存在用于绑定事件的bind方法,也相应存在用于移出绑定事件的方法,在JQuery中,可以通过unbind方法移除所有绑定的事件或某一个事件。 2、示例代码: 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/htm...

JQuery入门——事件切换之toggle()方法应用介绍【图】

1、在toggle()方法中,可以依次调用N个指定的函数,直到最后一个函数,然后重复对这个函数轮番调用,其语法如下:toggle(fn, fn2, [fn3, fn4,...]),其中fn、fn2、fn3、fn4等函数依次调用。 2、示例代码: 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-T...

JQuery入门——事件切换之hover()方法应用介绍【图】

1、在JQuery中,有两个方法用于事件的切换,一个方法是hover(),另一个是toggle()。所谓切换事件,即有两个以上的事件绑定于一个元素,在元素的行为动作间进行切换。如一个超级链接标记<a>若想实现当鼠标悬停时触发一个事件,鼠标移出时又触发一个事件,可以用切换事件轻松实现。 2、示例代码: 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.d...

jquery入门—编写一个导航条(可伸缩)【图】

1、编写一个导航条,单击标题时,可以伸缩导航条内容,简化内容或显示更多内容。 示例代码如下: 代码如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <script language="javascript" type="text/javas...

jquery入门—数据删除与隔行变色以及图片预览【图】

1、功能需求:表格中数据隔行变色、删除数据、全选删除、鼠标移动到图片时显示图片预览 2、示例代码如下: 代码如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> 数据管理 </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <script language="javascript" type="text/...

jquery Mobile入门—多页面切换示例学习【图】

1、在JQuery Mobile中,多个页面的切换是通过<a>元素、并将<href>属性设置为#+对应的id号的方式进行的。 2、多页面切换示例代码: 代码如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <meta name="viewport" content="width=device-width,initial-scale=1"/> <link href="Css/jquery.mobile-1.2.0.min.css" rel="Stylesheet" type="text/css"/> <script src="...

jquery Moblie入门—hello world的示例代码学习【图】

1、需要运行JQuery Mobile 移动应用页面,需要下载JQuery Mobile 3个相关插件文件(有多版本),jquery.mobile-1.2.0.min.css、jquery-1.8.3.min.js、jquery.mobile-1.2.0.min.js,JQuery Mobile官网地址:http://jquerymobile.com 2、将插件文件加载到页面中,注意它们的加载顺序,语句如: 代码如下:<link href="Css/jquery.mobile-1.2.0.min.css" rel="Stylesheet" type="text/css"/> <script src="Js/jquery-1.8.3.min.js" ty...

jquery Mobile入门—外部链接切换示例代码【图】

1、内部链接是通过在<a>标签内将href属性值设为#+id的形式,外链则是在<a>中增加rel属性,并将属性值设为external,如:<a href="about.html" rel="external">3i Studio</a> 2、外部链接切换示例代码: 代码如下:<!DOCTYPE HTML > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <meta name="viewport" content="width=device-width,initial-scale=1"/> <link hre...

入门 - 相关标签