复合事件ready,hover,toggle

1.ready

2.hover

3.toggle(fn1,fn2, …)(被废弃)

2.hover(fn(){……},fn(){……})

示例:

$(‘div‘).hover(function(){
	$(this).html(‘1‘);
},function(){
	$(this).html(‘2‘);
});

效果:

3.toggle被废弃了,怎么使用类似的效果了,我可以做个计数器的方法来使用。

示例:

代码如下:

	var flag = 1; //通过计数来实现
	$(‘div‘).click(function(){
		if(flag == 1){
			$(‘div‘).html(‘1111‘);
			flag = 2;
		}else if(flag == 2){
			$(‘div‘).html(‘2222‘);
			flag = 3;
		}else if(flag == 3 ){
			$(‘div‘).html(‘3333‘);
			flag = 1;
		}
	});

  

时间: 2024-12-28 20:55:29

复合事件ready,hover,toggle的相关文章

jquery事件切换hover/toggle

1.hover([over,]out) 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法.这是一个自定义的方法,它为频繁使用的任务提供了一种“保持在其中”的状态. 当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数.当鼠标移出这个元素时,会触发指定的第二个函数.而且,会伴随着对鼠标是 否仍然处在特定元素中的检测(例如,处在div中的图像),如果是,则会继续保持“悬停”状态,而不触发移出事件(修正了使用mouseout事件的一个 常见错误). 参数: over:鼠标移到元素上要

jQuery的切换函数(hover,toggle)

1.hover:(鼠标悬停与离开事件) 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法.这是一个自定义的方法,它为频繁使用的任务提供了一种“保持在其中”的状态. 当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数.当鼠标移出这个元素时,会触发指定的第二个函数.而且,会伴随着对鼠标是否仍然处在特定元素中的检测(例如,处在div中的图像),如果是,则会继续保持“悬停”状态,而不触发移出事件(修正了使用mouseout事件的一个常见错误). 参数 over,outFunction

jquery练习笔记

<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <style> #pannel { position:relative; width:100px; height:100px; b

toggle

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="resource/bootstrap/css/bootstrap.css"/> <script src="reso

如何用 CSS 创作一个立体滑动 toggle 交互控件

效果预览 在线演示 按下右侧的"点击预览"按钮在当前页面预览,点击链接全屏预览. https://codepen.io/zhang-ou/pen/zjoOgX 可交互视频教程 此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码. 请用 chrome, safari, edge 打开观看. https://scrimba.com/c/cPvMzTg 源代码下载 本地下载 请从 github 下载. https://github.com/comehope/front-end-dail

JQuery中的Dom操作和事件

(一)JQuery中的事件 1.常规事件,把js事件中的on去掉 复合事件:hover(function(){},function(){}) ---- 相当于把鼠标移入移出事件和在一起执行 toggle(function(){},function(){},....)可以写多个,点击事件循环执行 未来元素:对象.live("事件名",function(){});   --- 对未来创建的元素进行操作 列子:点击按钮,创建元素,并给创建的元素添加点击事件 //对象.append():在什么

jQuery官网一个关于菜单的例子

来源地址:https://my.oschina.net/xngiser/blog/28323 <ul id="menu"> <li class="menu">Sub 1 <ul> <li>test 1</li> <li>test 2</li> <li>test 3</li> <li>test 4</li> </ul> <

JQuery中的事件(三)

一:页面载入 ready(fn)当DOM载入就绪可以查询及操纵时绑定一个要执行的函数.这是事件模块中最重要的一个函数,因为它可以极大地提高web应用程序的响应速度.简单地说,这个方法纯粹是对向window.load事件注册事件的替代方法.通过使用这个方法,可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数,而99.99%的JavaScript函数都需要在那一刻执行.有一个参数--对jQuery函数的引用--会传递到这个ready事件处理函数中.可以给这个参数任意起一个名字,并因此可以不再

jQuery-3~5章

jQuery-3~5章 JQuery003-JQuery中的DOM操作 jQuery中的DOM操作: 1.查找节点 A.查找元素节点 B. 查找属性节点 var s1 = $("ul li:eq(1)"); var li_txt = s1.txt(); alert(li_txt); var $para = $("p"); var p_txt = $para.attr("title"); alert(p_txt); 2.创建节点 为了使页面更加智能