来源地址:http://www.g2room.com/jquery/index.php?p=example%2Fevent%2Fmouseover.html&n=%E9%BC%A0%E6%A0%87%E4%BA%8B%E4%BB%B6%E4%B9%8B%E9%BC%A0%E6%A0%87%E6%BB%91%E8%BF%87%E4%BA%8B%E4%BB%B6MOUSEOVER

var i = 0;
// 定义当事件触发后执行的方法
function showContent (event){
	$("span").eq(0).after("<span>第"+i+"次触发了"+event.data.name+"("+event.data.code+")事件,触发元素:"+$(this).get(0).tagName+"</span><br/>");
	$(this).stop().fadeTo('slow',i%2==0 ? 0.4 : 1);
	i++;
}
$(function(){
	// 在input上绑定mouseover事件
	// 当鼠标滑过input元素时被触发。
	// 这里使用了多个元素绑定一个事件,实际运用中基本上都是需要单独处理的。
	$("input,textarea,select").mouseover(function showContent (){
		$("span").eq(0).after("<span>第"+i+"次触发了鼠标光标移动(mouseover)事件,触发元素:"+$(this).get(0).type+"</span><br/>");
		$(this).stop().fadeTo('slow',i%2==0 ? 0.4 : 1);
		i++;
	});
	// 在DIV、span和p元素上绑定mouseover事件
	// 且传入了事件参数
	$("div,span,p,li,dd").mouseover({code:"mouseover",name:"鼠标按下事件"},showContent);
});

截图效果如下:

												

鼠标事件之鼠标滑过事件MOUSEOVER的更多相关文章

  1. 【原创】解决鼠标经过子元素触发mouseout,mouseover事件的问题

    关键词:父子元素关系  mouseout  mouseover  事件  事件冒泡 初期代码: <!DOCTYPE html> <html> <head> < ...

  2. jQuery-3.事件篇---鼠标事件

    jQuery鼠标事件之click与dbclick事件 用交互操作中,最简单直接的操作就是点击操作.jQuery提供了两个方法一个是click方法用于监听用户单击操作,另一个方法是dbclick方法用于 ...

  3. 整理之DOM事件阶段、冒泡与捕获、事件委托、ie事件和dom模型事件、鼠标事件

    整理之DOM事件阶段 本文主要解决的问题: 事件流 DOM事件流的三个阶段 先理解流的概念 在现今的JavaScript中随处可见.比如说React中的单向数据流,Node中的流,又或是今天本文所讲的 ...

  4. c#全局鼠标事件以及鼠标事件模拟

    最近在编写Max插件时,其主容器FlowLayoutPanel由于隐藏了滚动条,要实现按住鼠标中键上下拖动的功能,因此尝试了全局鼠标事件.以及鼠标勾子,可惜由于Max不争气?都未能实现,于是代码报废, ...

  5. jQuery编程基础精华03(RadioButton操作,事件,鼠标)

    RadioButton操作 取得RadioButton的选中值,被选中的radio只有一个值,所以直接用val()  $('#btn1').click(function () {           ...

  6. javascript滚动栏响应鼠标滑轮的实现上下滚动事件

    实现鼠标滚动滚轮事件: <script type="text/javascript"><pre name="code" class=" ...

  7. JAVA之旅(三十一)——JAVA的图形化界面,GUI布局,Frame,GUI事件监听机制,Action事件,鼠标事件

    JAVA之旅(三十一)--JAVA的图形化界面,GUI布局,Frame,GUI事件监听机制,Action事件,鼠标事件 有段时间没有更新JAVA了,我们今天来说一下JAVA中的图形化界面,也就是GUI ...

  8. WPF,强制捕获鼠标事件,鼠标移出控件外依然可以执行强制捕获的鼠标事件

    在WPF中,只有鼠标位置在某个控件上的时候才会触发该控件的鼠标事件.例如,有两个控件都注册了MouseDown和MouseUp事件,在控件1上按下鼠标,不要放开,移动到控件2上再放开.在这个过程中,控 ...

  9. Unity3D笔记十六 输入输出-键盘事件、鼠标事件

    输入与控制操作Unity为开发者提供了Input类库,其中包括键盘事件.鼠标事件和触摸事件等一切跨平台所需要的控制事件. 一.键盘事件 1.按下事件 Input.GetKeyDown():如果按键被按 ...

随机推荐

  1. css居中技巧

    1    text-align: center; 只能对图片,按钮,文字等行内元素(display为inline或inline-block等)进行水平居中.在IE6.7中能对任何元素进行水平居中.另外 ...

  2. jq之简单表单验证

    <body> <form method="post" action=""> <div class="int"& ...

  3. ReetrantLock Synchronized Atomic的性能对比

    之前看到了一篇帖子关于Lock和Synchronized的性能,写的是Lock比Synchronized的性能要好,可是,我试了下,结果却不是这样的,我所使用的JDK的版本是1.7,可能跟原帖作者用的 ...

  4. WARN TaskSetManager: Lost task 0.0 in stage 0.0 (TID 0, worker1): java.lang.ClassNotFoundException: com.spark.firstApp.HelloSpark$$anonfun$2

    进行如下设置,解决报错信息. val conf = new SparkConf().setAppName("helloSpark").setMaster("spark:/ ...

  5. 外边距叠加collapsing-margin

    原载:Smallni | http://www.smallni.com/collapsing-margin/ 恩,margin叠加一直是个问题,也是我们一直会遇到的问题,很久以前就想把这个知识点整理下 ...

  6. Windows Phone 使用 WriteableBitmap后台生成图片

    这几天项目是遇到一个需求,需要后台把几个元素生成到一张图片上,并保存到文件中 private void cutscreen_Click(object sender, EventArgs e) { Gr ...

  7. 自己总结python用xlrd\xlwt读写excel

    1.首先安装xlrd\xlwt模块 xlrd模块下载地址: https://pypi.python.org/pypi/xlrd xlwt模块下载地址: https://pypi.python.org/ ...

  8. HTML5验证及日期显示

    以前忽略了HTML5的强大功能,谁知有了它数据大部分都不需要自己验证,显示日历也不需要插件啦,一些小功能分享给大家 1.Email输入框,自动验证Email有效性. <!DOCTYPE HTML ...

  9. iOS开发——OC篇&特殊数据类型

    一些特殊的数据类型 id.nil.Nil.SEL ,IMP Objective-C中有一些很有趣的数据类型经常会被错误地理解.他们中的大多数都可以在/usr/include/objc/objc.h或者 ...

  10. 学c语言做练习之​统计文件中字符的个数

    统计文件中字符的个数(采用命令行参数) #include<stdio.h> #include<stdlib.h> int main(int argc, char *argv[] ...