`
xplq
  • 浏览: 89871 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

捕捉鼠标点击

阅读更多

两个函数帮助我们捕捉鼠标点击:onmousedown与onmouseup.当我们获取document.onmousedown时,我们同时获取了任何对象的点击属性如:text,images,tables等等.我们只想获取那些需要的属性,所以我们设置函数来获取。

document.onmouseup = mouseUp;
var dragObject = null;
function makeClickable(item)
{
	if (!item)	return;
	item.onmousedown = function(ev)
	{
		dragObject = this;			
	}
}

function mouseUp(ev)
{
	dragObject = null;
}

  dragObject 变量就是鼠标点击的对象,鼠标弹起时候,该对象便为空。

示例:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
legend {
	font-weight: bold;
	font-size: 12px;
	color: #666699;
	font-family: verdana, tahoma, arial;
}

fieldset {
	padding: 3px;
}
</style>
<title>点击</title>
<script type="text/javascript">
	window.onload = function()
	{
		makeClickable($('ClickImage1'));
		makeClickable($('ClickImage2'));
		makeClickable($('ClickImage3'));
		makeClickable($('ClickImage4'));
	}
	document.onmouseup = mouseUp;
	var dragObject = null;
	function makeClickable(item)
	{
		if (!item)
			return;
		item.onmousedown = function(ev)
		{
			//dragObject = this;
			$('ClickImage').value = this.name;
		}
	}

	function mouseUp(ev)
	{
		dragObject = null;
	}
	function $(id)
	{
		return document.getElementById(id);
	}
</script>
</head>
<body>
<fieldset id="Demo">
	<legend>示例 - 点击图标</legend> 
	<img id="ClickImage1" src="images/spade.gif" name="黑桃"> 
	<img id="ClickImage2" src="images/heart.gif" name="红星">
	<img id="ClickImage3" src="images/diamond.gif" name="方块">
	<img id="ClickImage4" src="images/club.gif" name="梅花"> <br>
	你单击: <input id="ClickImage">
</fieldset>
</body>
</html>

 效果:
 

 点击什么,出什么。呵呵

  • 大小: 6.2 KB
分享到:
评论

相关推荐

    VS开发基础源码---鼠标点击特效

    1. **捕捉鼠标点击事件**:使用WinAPI的`SetCapture`函数来捕获鼠标的点击事件,当用户点击屏幕时,程序会接收到消息。 2. **计算点击位置**:在接收到鼠标点击事件后,需要获取点击的坐标,这可以通过`...

    易语言截获鼠标单击事件用于屏幕取色.rar

    "易语言截获鼠标单击事件用于屏幕取色"这个主题,就是关于如何在易语言环境中,利用程序逻辑来捕捉鼠标点击事件,并在此基础上实现屏幕取色功能的一个实例。 易语言是一种以中文编程为特色的编程语言,它的设计目标...

    鼠标点击精灵 3.9.135破解版

    ·模拟鼠标点击 ·任意设置点击位置(F12/F11键定位鼠标点击位置) ·任意设置点击时间间隔(在两个定义的时间内点击) ·任意设置点击顺序(按自定义的位置,顺序点击或随机点击) ·任意设置点击方式(鼠标单击或...

    怎样捕捉鼠标键盘按键

    在IT领域,捕捉鼠标键盘按键是一项常见的需求,尤其在软件开发、自动化测试、游戏编程以及监控用户行为等场景中。本文将深入探讨如何在不同环境下实现这一功能,并提供相关技术的详细解析。 首先,我们要明白捕获...

    捕捉鼠标与屏幕delphi例子

    对于模拟鼠标点击,可以使用`SendInput`函数,它允许你模拟各种鼠标和键盘事件。 ```delphi uses Windows; var P: TPoint; begin GetCursorPos(P); // 获取当前鼠标位置 SetCursorPos(P.X + 10, P.Y + 10); //...

    捕捉鼠标,防止鼠标逃出窗口(2KB)...

    这个"捕捉鼠标,防止鼠标逃出窗口"的功能,是通过编程实现的一种控制用户交互的方式。以下将详细解释这个知识点。 首先,我们要理解"捕捉鼠标"的概念。在计算机图形用户界面中,捕捉鼠标是指将鼠标的焦点固定在某个...

    VC++消息映射与处理\在视图窗口实现捕捉鼠标

    它允许程序员定义控件和窗口如何响应各种Windows消息,如鼠标点击、键盘输入等。本篇将深入探讨如何在视图窗口实现捕捉鼠标,这在开发图形用户界面(GUI)应用时尤为重要。 首先,理解消息映射(Message Map)。在...

    鼠标拖拽物体(一)1

    总结起来,实现鼠标拖拽物体的关键在于捕捉鼠标点击事件(`OnMouseDown`),计算物体与鼠标点击位置的关系(`offset`),然后在鼠标移动时更新物体位置(`OnMouseDrag`)。这个过程结合了Unity的碰撞检测、相机转换...

    图像处理基于matlab实现鼠标画图.zip

    在实现鼠标画图时,MATLAB提供了`ginput`函数,它可以捕捉鼠标点击的坐标,但在这里,由于我们是通过持续的鼠标拖动来画图,所以更可能使用的是`WindowButtonDownFcn`和`WindowButtonMotionFcn`这两个回调函数。...

    鼠标点击精灵V3.9.32模拟手工鼠标点击动作中文特别版

    模拟手工鼠标点击动作,可以随意设置点击时间间隔与点击的方式,并能很轻易地捕捉想要点击的位置。另外,可以在同一位置快速多次点击(游戏点击模式)。 绿色软件,无需安装。主要功能【标准点击模式】·模拟鼠标...

    鼠标捕捉区域鼠标捕捉区域

    当一个窗口或控件捕获了鼠标时,即使鼠标离开该窗口的可视边界,鼠标事件(如鼠标移动、点击等)仍然会发送到该窗口或控件。这意味着,用户的鼠标操作将被限制在这个捕获了鼠标的对象上,直到捕获被释放。这对于某些...

    捕获鼠标坐标连续点击源码

    例如,`mousemove`事件可以用来监听鼠标的移动,`click`事件则用于监听鼠标点击。通过注册这些事件处理器,我们可以获取到鼠标的相关信息并作出反应。 2. **鼠标坐标获取**: 当鼠标在屏幕上移动时,系统会生成...

    窗口 鼠标坐标.txt

    ### 知识点详解 #### 一、Java AWT与Swing概述 ...通过上述分析可以看出,该Java程序主要展示了如何在Swing框架下捕捉鼠标点击事件并显示点击位置的坐标,这对于理解和实践Java GUI编程非常有帮助。

    Slider鼠标点击 滑块移动

    在鼠标点击事件发生时,我们需要捕捉这个事件,并计算出鼠标点击位置相对于轨道起始点的距离,以确定新的滑块位置。 实现这一功能通常涉及以下几个步骤: 1. **事件监听**:首先,我们需要为Slider添加鼠标点击...

    vb Hook 监听 捕捉键盘,鼠标事件

    `WH_MOUSE`类型的钩子则用于鼠标事件,包括鼠标移动、点击等。在钩子回调函数(通常为`Sub`或`Function`)中,我们会接收到包含事件信息的结构体,例如`WM_KEYDOWN`表示按键按下,`WM_KEYUP`表示按键释放,`WM_...

    3D小游戏:移动的鼠标

    在Java中,我们可以使用`MouseListener`和`MouseMotionListener`接口来捕捉鼠标点击和移动事件。当鼠标移动时,对应的坐标会被转换为3D空间中的方向或旋转值,从而改变游戏对象的位置或视角。 在3D环境中,坐标转换...

    js实现鼠标点击文本框自动选中内容的方法

    1. JavaScript中的onClick事件处理器,用于捕捉元素上的鼠标点击行为。 2. select()方法,用于选中文本框或文本区域内的所有文本。 3. DOM操作,通过JavaScript函数来动态操作页面上的HTML元素,从而实现交互功能。 ...

    鼠标点击按钮任意的移动

    在IT领域,鼠标点击按钮的任意移动是一种常见的交互方式,尤其在软件开发、自动化测试以及游戏编程中。这种技术使得用户或程序能够模拟人类操作,实现对计算机界面的精确控制。下面将详细解释这一概念及其相关知识点...

    C# ASP.NET Javascript - 捕捉鼠标左右键事件

    在ASP.NET中,我们可以使用服务器端控件的事件来处理用户输入,包括鼠标点击事件。例如,对于一个按钮控件,我们可以处理`Click`事件来响应鼠标左键的点击: ```csharp protected void Button1_Click(object sender...

Global site tag (gtag.js) - Google Analytics