jQuery

本教程时候有一定前端基础的人员学习.

常用方法:

parent():返回元素的直接父元素

parents():返回元素的所有父元素

children():返回所选元素的所有直接子元素.

siblings():返回所选元素的所有兄弟元素.

next():返回下一个兄弟元素

nextAll():返回后面的所有兄弟元素.

prev():返回上一个兄弟元素.

prevAll():返回前面的所有兄弟元素.

eq():从多个选定元素中选择指定索引号的元素.

remove():删除所选元素及其子元素.

empty():删除所选元素的子元素.

常见事件:

鼠标事件:

click:单击事件

dbclick:双击事件

mouseenter:鼠标进入事件

mouseleave:鼠标离开事件

mouseover:鼠标悬停事件

键盘事件:

keydown:按键按下事件

keyup:按键松开事件

表单事件:

submit:表单提交事件

change:表单域改变事件

focus:表单元素获得焦点事件

blur:表单元素失去焦点事件

文档事件:

ready:DOM加载完成事件

resize:浏览器窗口大小改变事件

scroll:滚动条触发事件

代码演示:

$(function(){//文档加载完之后执行jQuery代码  $('#p1').click(function(){//id='p1'的元素的点击事件var p2=$('

执行后的效果:

点击查看日期在后面显示本地日期

on()方法绑定事件

$('p').on('click',function(){  alert('on方法将段落p绑定了点击事件');})

on()方法用于将相同的处理函数绑定到多个事件中时很有用.多个事件之间用空格隔开.

$('p').on('click dbclick',function(){  alert('段落p绑定了点击和双击事件,多个事件之间用空格隔开');})

off()方法解除事件绑定

$('p').off('click')//删除点击事件

jQuery的事件对象

每个事件处理函数都可以接收一个事件对象,其中包括与该事件相关的属性和方法:

pageX,pageY:事件发生时,相对于页面左上角的鼠标位置(x和y坐标)

type:事件类型

which:哪个按钮或键被按下

data:绑定事件时,传入的任何数据

target:事件发生的对象

preventDefault():阻止事件的默认动作

stopPropagation():停止冒泡到其他元素的事件

事件对象

$('a').click(function(event){    //事件对象event作为参数传递给事件处理函数alert(event.pageX);      //弹出事件发生时,鼠标的x坐标event.preventDefault(); //阻止打开href属性中的链接})

trigger()方法以编程方式触发事件.

trigger()方法不能用来模仿本机浏览器事件,比如点击一个文件文本框.只能处理jQuery事件系统中的事件.

例如:编程方式触发点击事件,而不需要用户实际点击一个元素.

$('a').click(function(event){alert(event.pageX);// event.preventDefault();})setTimeout(function(){//定时器,3s后执行        $('a').trigger('click')//编程触发a元素的点击事件      },3000)

jquery加载完成后方法只执行一次_JavaScript的超级库--jQuery内容整理(3)相关推荐

SpringMVC--Ajax异步加载数据$(function (){ 逻辑代码}) 的意思是让dom结构加载完毕后再去执行逻辑代码
1. SpringMVC–Ajax异步加载数据 1.1 实体类user User.java package com.tian.pojo;import lombok.AllArgsConstructor ...
JavaScript--JQuery事件当网页元素加载完成后再去执行事件
1. JQuery事件 JQuery帮助文档: 这里的selector都是CSS选择器的语法 CSS选择器示例1 弹出提示框: <!DOCTYPE html> <html lang ...
better—scrolls解决下拉刷新，上拉加载更多时出现只执行一次的问题
问题在调用scrolls时出现只刷新一次的问题解决在每一次执行完加载或刷新时,上拉或者下拉,结束后,需要执行finishPullUp()或者finishPullDown(),否则将不会执行下次操 ...
动态加载JS后执行后续文件
在正常的加载过程中,js的加载都是同步的,也就是在加载过程中,浏览器会阻塞接下来的内容的加载. 但有时候我们需要加载完JS后,执行某个函数.这时候我们就要用到动态加载,动态加载是异步的,如果我们在后边 ...
js页面加载完成后自动执行指定方法
1.要执行的代码是在DOM元素被加载完成的情况下执行,同一个页面可以反复调用该方法,会按照先后顺序依次执行 //jquery提供的完整方法 $(document).ready(function () ...
jQuery EasyUI动态添加控件或者ajax加载页面后不能自动渲染问题的解决方法
博客分类: jquery-easyui jQueryAjax框架HTML 现象: AJAX返回的html无法做到自动渲染为EasyUI的样式.比如:class="easyui-layout ...
JS，两种在页面加载完成后自动执行的方法（ready，onload）
JS,两种在页面加载完成后自动执行的方法 1.jQuery的ready事件,需要引入jQuery的包才能使用,表示文档结构已经加载完成(不包含图片等非文字媒体文件): ready可以多次调用,可以绑定 ...
html动态加载js方法,原生JS实现动态加载js文件并在加载成功后执行回调函数的方法...
本文实例讲述了原生JS实现动态加载js文件并在加载成功后执行回调函数的方法.分享给大家供大家参考,具体如下: 有的时候需要动态加载一个javascript文件,并且在加载成功后执行回调函数(例如文件中 ...
js 和jQuery（自动执行函数）立即执行函数和页面加载完后执行函数写法
js 立即执行函数的写法. js 立即执行函数只能用于匿名函数,如果声明了函数名是不可以用立即执行的,通常在函数表达式后加一对小括号()用于立即执行如果想让函数不被调用的情况下,立即自动执行,需要在 ...

jquery加载完成后方法只执行一次_JavaScript的超级库--jQuery内容整理(3)

常用方法:

常见事件:

代码演示:

jquery加载完成后方法只执行一次_JavaScript的超级库--jQuery内容整理(3)相关推荐

最新文章

热门文章