JQuery 常用方法和事件详细介绍

 更新时间:2013年04月18日 16:42:06   作者:  
本篇文章是关于JQuery 常用方法和事件详细介绍。需要的朋友参考下

文档就绪函数
$(document).ready(function(){
--- jQuery functions go here ----
});
这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码。
如果在文档没有完全加载之前就运行函数,操作可能失败。(试图隐藏一个不存在的元素;获得未完全加载的图像的大小)

把所有 jQuery 代码置于事件处理函数中
把所有事件处理函数置于文档就绪事件处理器中

hide/show/toogle
$(selector).hide(speed,callback);
$(selector).show(speed,callback);
$(selector).toggle(speed,callback);
可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示或切换完成后所执行的函数名称。

jQuery 事件

Event 函数 绑定函数至
$(document).ready(function) 将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function) 触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件
$(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件

jQuery Fading 方法:

通过 jQuery,您可以实现元素的淡入淡出效果。

jQuery 拥有下面四种 fade 方法:

  • fadeIn()
  • fadeOut()
  • fadeToggle()

  可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。可选的 callback 参数是 fading 完成后所执行的函数名称。

  • fadeTo()

  jQuery fadeTo() 方法允许渐变为给定的不透明度(值介于 0 与 1 之间)。

  $(selector).fadeTo(speed,opacity,callback);

  必需的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

  必需的 opacity 参数将淡入淡出效果设置为给定的不透明度(值介于 0 与 1 之间)。

  可选的 callback 参数是该函数完成后所执行的函数名称。

由于 JavaScript 语句(指令)是逐一执行的,按照次序,动画之后的语句可能会产生错误或页面冲突,因为动画还没有完成。

为了避免这个情况,您可以以参数的形式添加 Callback 函数。如果您希望在一个涉及动画的函数之后来执行语句,请使用 callback 函数。

相关文章

  • jquery常用操作小结

    jquery常用操作小结

    这篇文章主要介绍了jquery常用操作小结,需要的朋友可以参考下
    2014-07-07
  • 15个常用的jquery代码片段

    15个常用的jquery代码片段

    这篇文章主要介绍了15个常用的jquery代码片段,对大家学习jquery程序设计有所帮助,需要的朋友可以参考下
    2015-12-12
  • jQuery实现飞机大战游戏

    jQuery实现飞机大战游戏

    这篇文章主要为大家详细介绍了jQuery实现飞机大战游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-05-05
  • jQuery实现仿腾讯迷你首页选项卡效果代码

    jQuery实现仿腾讯迷你首页选项卡效果代码

    这篇文章主要介绍了jQuery实现仿腾讯迷你首页选项卡效果代码,可实现tab切换按钮的左右滑动显示及点击切换效果,涉及jQuery基于鼠标事件实现页面元素动态操作技巧,需要的朋友可以参考下
    2015-09-09
  • jQuery实现拖动调整表格单元格大小的代码实例

    jQuery实现拖动调整表格单元格大小的代码实例

    这篇文章主要介绍了jQuery实现拖动调整表格单元格大小的代码实例,本文直接给出实现代码,需要的朋友可以参考下
    2015-01-01
  • JQuery仿小米手机抢购页面倒计时效果

    JQuery仿小米手机抢购页面倒计时效果

    这篇文章主要介绍了JQuery仿小米手机抢购页面倒计时效果,从功能到实现原理以及主要代码都做了详细的介绍,推荐给有相同需求的小伙伴。
    2014-12-12
  • jQuery Easyui 下拉树组件combotree

    jQuery Easyui 下拉树组件combotree

    项目中做角色授权时,需要做一个下拉框带树结构的 并且可以多选的组件,就想到了easyui的combotree,下面通过实例代码给大家介绍下Easyui 下拉树组件combotree
    2016-12-12
  • JQuery在页面中添加和除移DOM示例代码

    JQuery在页面中添加和除移DOM示例代码

    本文为大家介绍下使用JQuery实现在页面中添加和除移DOM主要使用了以下几个方法,感兴趣的朋友可以了解下哈,希望对大家有所帮助
    2013-06-06
  • 一篇文章带你入门和了解Jquery的基础操作

    一篇文章带你入门和了解Jquery的基础操作

    这篇文章主要讲述了一个JQuery入门基础,实现的过程效果都很简单,特别适合初学者来学习,感兴趣的小伙伴们可以参考一下
    2021-11-11
  • jQuery 常见学习网站与参考书

    jQuery 常见学习网站与参考书

    打算学习jquery的朋友可以参下如下网上,参考书吗,可以看下 锋利的jquery脚本之家提供电子版下载。
    2009-11-11

最新评论