本文简介 这几天在整理书柜时看到这套书,看到梵高,想起他的点彩画。 想到点彩画派,不得不提的一个画家叫乔治·皮埃尔·秀拉。据说梵高也模仿过他的画作。...思前想后,还是觉得用 p5.js 写会好点,毕竟这个库也是个比较知名的艺术库。 于是查了一下 p5.js 的 api ,做了一个简陋版的工具。...以下是完整代码,可以结合上面的讲解和代码中的注释一起理解。...fill(selectedColor) noStroke() circle(mouseX, mouseY, selectedSize) } } // 当鼠标按下时...npm 下载的 p5.js 是有一丢丢区别的,想了解这方面知识可以看看 《p5.js 使用npm安装p5.js后如何使用?》
以下是这些事件处理函数的简要说明: 鼠标按下事件 (mousePressEvent): 当鼠标按下时触发。在该函数中,你可以处理鼠标按下时的逻辑,如获取鼠标坐标、进行拖拽等。...鼠标释放事件 (mouseReleaseEvent): 当鼠标释放时触发。你可以在该函数中处理鼠标释放时的逻辑,如执行点击操作。...鼠标滚轮事件 (wheelEvent): 当鼠标滚轮滚动时触发。你可以在该函数中处理鼠标滚轮事件,如放大缩小、滚动视图等。 键盘按下事件 (keyPressEvent): 当键盘按键被按下时触发。...在该函数中,你可以处理键盘按下时的逻辑,如捕捉特定按键的按下。 键盘抬起事件 (keyReleaseEvent): 当键盘按键被抬起时触发。...你可以在该函数中处理键盘抬起时的逻辑,如释放某个按键的状态。 在附件中笔者将代码整理成了Keyboard and mouse文件,读者可自行打开该文件编译运行观察键盘鼠标事件是如何被重写的。
mouseenter 指针移到有事件监听的元素内 mouseover 指针移到有事件监听的元素或者它的子元素内 mousemove 指针在元素内移动时持续触发 mousedown 在元素上按下任意鼠标按钮...mouseup 在元素上释放任意鼠标按键 click 在元素上按下并释放任意鼠标按键 dblclick 在元素上双击鼠标按钮 contextmenu 右键点击 (右键菜单显示前). mouseleave...; } //当鼠标离开时触发 d.onmouseout = function(){ console.log('不要啊'); } //当鼠标按下时触发...('t'); //当键盘按下时触发 d.onkeydown = function(){ console.log('推到?')...当点击div1时,触发 事件1,但是,紧跟着,事件2和事件3也被触发了; 这种现象,我们称为 事件冒泡 在JS中当一个事件发生以后,它会在不同的DOM节点之间传播。
,系统提供的事件类型如下: 枚举对象定义 对应的事件名 事件触发的时机 cc.Node.EventType.MOUSE_DOWN 'mousedown' 当鼠标在目标节点区域按下时触发一次 cc.Node.EventType.MOUSE_ENTER...'mouseenter' 当鼠标移入目标节点区域时,不论是否按下 cc.Node.EventType.MOUSE_MOVE 'mousemove' 当鼠标在目标节点在目标节点区域中移动时,不论是否按下...当鼠标从按下状态松开时触发一次 cc.Node.EventType.MOUSE_WHEEL 'mousewheel' 当鼠标滚轮滚动时 鼠标事件(cc.Event.EventMouse)的重要 API...当鼠标或手指在B节点区域内按下时,事件将首先在B节点触发,B节点监听器接收到事件。接着B节点会将事件向其父节点传递这个事件,A节点的监听器将会接收到事件。这就是最基本的事件冒泡过程。...当鼠标或手指在C节点区域内按下时,事件将首先在C节点触发并通知C节点上注册的事件监听器。
//在HTML中把事件处理函数作为属性执行JS代码 //注意单双引号 //在HTML...JavaScript事件处理函数及其使用列表 事件处理函数 影响的元素 何时发生 onabort 图像 当图像加载被中断时 onblur 窗口、框架、所有表单对象 当焦点从对象上移开时 onchange...图像、链接、表单 当按键被按下时 onkeypress 文档、图像、链接、表单 当按键被按下然后松开时 onkeyup 文档、图像、链接、表单 当按键被松开时 onload 主题、框架集、图像 文档或图像加载后...input.onmousedown = function () { alert('Lee'); }; mouseup:当用户释放鼠标按钮时触发。...input.onmouseout = function () { alert('Lee'); }; mousemove:当鼠标指针在元素上移动时触发。
click:按下鼠标时触发。 dblclick:在同一个元素上双击鼠标时触发。 mousedown:按下鼠标键时触发。 mouseup:释放按下的鼠标键时触发。...mousemove:当鼠标在一个节点内部移动时触发。当鼠标持续移动时,该事件会连续触发。为了避免性能问题,建议对该事件的监听函数做一些限定,比如限定一段时间内只能运行一次。...mouseenter:鼠标进入一个节点时触发,进入子节点不会触发这个事件 mouseover:鼠标进入一个节点时触发,进入子节点会再一次触发这个事件 mouseout:鼠标离开一个节点时触发,离开父节点也会触发这个事件...mouseleave:鼠标离开一个节点时触发,离开父节点不会触发这个事件 wheel:滚动鼠标的滚轮时触发 事件注意事项 click事件指的是,用户在同一个位置先完成mousedown动作,再完成...mouseover事件和mouseenter事件,都是鼠标进入一个节点时触发。两者的区别是,mouseenter事件只触发一次,而只要鼠标在节点内部移动,mouseover事件会在子节点上触发多次。
QAbstractButton提供的信号如下表 信号 含义 Pressed 当鼠标指针在按钮上并按下左键时触发该信号 Released 当鼠标左键被释放时触发该信号 Clicked 当鼠标左键被按下然后释放时...,或者快捷键被释放时触发该信号 Toggled 当按钮的标记状态发生改变时触发该信号 QPUshButton类中的常用方法 方法 描述 setCheckable() 设置按钮是否已经被选中,如果设置True...实现的目的:输入安妞的当前状态,按下还是释放 self.btn1.clicked.connect(self.btnstate) #添加控件到布局中 layout.addWidget...QPushButton代码分析: 在这个例子中,创建了四个按钮,这四个QPushButton对象被定义为类的实例变量,每个按钮都将clicked的信号发送给指定的槽函数,来响应按钮点击的事件 第一个按钮....toggle() 当这个按钮点击时,将clicked信号发送给槽函数btnstate(),通过btn.isChecked来获得按钮是否被点击或者释放的状态,其核心代码是 self.btn1.clicked.connect
2.keypress 当键盘或按钮被按下时,发生 keypress 事件。keypress 事件与 keydown 事件类似。当按钮被按下时,会发生该事件。它发生在当前获得焦点的元素上。...mousedown 与 click 事件不同,mousedown 事件仅需要按键被按下,而不需要松开即可发生。 2.mouseenter 当鼠标指针穿过元素时,会发生 mouseenter 事件。...当鼠标指针停留在元素上方,然后按下并松开鼠标左键时,就会发生一次 click。在很短的时间内发生两次 click,即是一次 double click 事件。...4.选中内容select :当 textarea 或文本类型的 input 元素中的文本被选择时,会发生 select 事件。这个函数会调用执行绑定到select事件的所有函数,包括浏览器的默认行为。...可以通过在某个绑定的函数中返回false来防止触发浏览器的默认行为。 四:其他事件: 1.scroll 当用户滚动指定的元素时,会发生 scroll 事件。
onmousedown IE4、N4 按下鼠标时触发此事件 onmouseup IE4、N4 鼠标按下后松开鼠标时触发此事件 onmouseover IE3、N2 当鼠标移动到某对象范围的上方时触发此事件...onmousemove IE4、N4 鼠标移动时触发此事件 onmouseout IE4、N3 当鼠标离开某对象范围时触发此事件 onkeypress IE4、N4 当键盘上的某个键被按下并且释放时触发此事件...onkeydown IE4、N4 当键盘上某个按键被按下时触发此事件 onkeyup IE4、N4 当键盘上某个按键被按放开时触发此事件 页面相关事件 onabort IE4、N3 图片在下载时被用户中断...[粘贴]到页面中时触发此事件 onbeforeupdate IE5、 N 当浏览者粘贴系统剪贴板中的内容时通知目标对象 oncontextmenu IE5、N 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件...ondragstart IE4、N 当某对象将被拖动时触发此事件 ondrop IE5、N 在一个拖动过程中,释放鼠标键时触发此事件 onlosecapture IE5、N 当元素失去鼠标移动所形成的选择焦点时触发此事件
IE4、N4 当键盘上的某个键被按下并且释放时触发此事件. onkeydown IE4、N4 当键盘上某个按键被按下时触发此事件 onkeyup IE4、N4 当键盘上某个按键被按放开时触发此事件...onreset IE4 、N3 当表单中RESET的属性被激发时触发此事件 onsubmit IE3 、N2 一个表单被递交时触发此事件 事件 浏览器支持 说明 onbounce IE4、N 在Marquee...]到页面中时触发此事件 onbeforeupdate IE5、 N 当浏览者粘贴系统剪贴板中的内容时通知目标对象 oncontextmenu IE5、N 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件...] ondragdrop IE、N4 一个外部对象被鼠标拖进当前窗口或者帧 ondragend IE5、N 当鼠标拖动结束时触发此事件,即鼠标的按钮被释放了 ondragenter IE5、N 当对象被鼠标拖动的对象进入其容器范围内时触发此事件...IE4、N 当某对象将被拖动时触发此事件 ondrop IE5、N 在一个拖动过程中,释放鼠标键时触发此事件 onlosecapture IE5、N 当元素失去鼠标移动所形成的选择焦点时触发此事件 onpaste
本例演示如何在运行时动态添加属性,同时通过Keys属性中的方法,遍历控件的属性并打印。...myac.Add("Name", "cgj");//添加属性到集合中 myac.Add("OnClick", "javascript:alert('Hello');")...onMouseUp 鼠标按下后,松开时激发的事件 onMouseOver 当鼠标移动到某对象范围的上方时触发的事件 onMouseMove 鼠标移动时触发的事件 onMouseOut 当鼠标离开某对象范围时触发的事件...onKeyPress 当键盘上的某个键被按下并且释放时触发的事件....[注意:页面内必须有被聚焦的对象] onKeyDown 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象] onKeyUp 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象
onMouseUp IE4|N4|O 鼠标按下后,松开时激发的事件 onMouseOver IE3|N2|O3 当鼠标移动到某对象范围的上方时触发的事件 onMouseMove IE4|N4|O...鼠标移动时触发的事件 onMouseOut IE4|N3|O3 当鼠标离开某对象范围时触发的事件 onKeyPress IE4|N4|O 当键盘上的某个键被按下并且释放时触发的事件....onContextMenu IE5|N|O 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件 [试试在页面中的中加入onContentMenu="return false...O 当某个对象被拖动时触发的事件 [活动事件] onDragDrop IE|N4|O 一个外部对象被鼠标拖进当前窗口或者帧 onDragEnd IE5|N|O 当鼠标拖动结束时触发的事件,即鼠标的按钮被释放了...IE5|N|O 当某被拖动的对象在另一对象容器范围内拖动时触发的事件 onDragStart IE4|N|O 当某对象将被拖动时触发的事件 onDrop IE5|N|O 在一个拖动过程中,释放鼠标键时触发的事件
当监听鼠标事件时,会触发一些事件,我们可以与之交互: mousedown 按下鼠标按钮触发 mouseup 鼠标按钮被释放 click 点击事件 dblclick 双击事件 mousemove 当鼠标移动到元素上时...小心使用mousemove,因为它在鼠标移动时多次触发。我们需要应用节流,这是我们在分析滚动时会详细讨论的东西。 在事件处理程序中,我们可以访问很多事件属性。...例如,在鼠标事件中,我们可以通过检查事件对象的button属性来检查哪个鼠标按钮被按下: const link = document.getElementById('my-link') link.addEventListener...button 如果有按钮,则为鼠标事件触发时按下的按钮数目(通常为0 =主按钮,1 =中按钮,2 =右按钮)。处理由单击按钮引起的事件(例如单击)。...ctrlKey 如果在事件触发时按下ctrl键,则ctrlKey为真。 metaKey 如果事件触发时按下了meta键,则metaKey true。
accesskey属性 用于指定激活元素的快捷键 tabindex属性 用于指定元素在tab键下的次序 dir属性 用于指定元素中内容的文本方向 属性值只有ltr或rtl两种,分别是 left to right...onblur当元素失去焦点时触发 onchange在元素的元素值被改变时触发 onfocus当元素获得焦点时触发 onreset当表单中的重置按钮被点击时触发 onselect在元素中文本被选中后触发...onsubmit在提交表单时触发 keyboard键盘事件 onkeydown在用户按下按键时触发 onkeypress在用户按下按键后,按着按键时触发。...onmousedown当元素上按下鼠标按钮时触发 onmousemove当鼠标指针移动到元素上时触发 onmouseout当鼠标指针移出元素时触发 onmouseover当鼠标指针移动到元素上时触发...onmouseup当在元素上释放鼠标按钮时触发 media媒体事件 onabort当退出时触发 onwaiting当媒体已停止播放但打算继续播放时触发。
>onkeypress IE4、N4 当键盘上的某个键被按下并且释放时触发此事件.... onkeydown IE4、N4 当键盘上某个按键被按下时触发此事件 IE5、N 浏览器的停止按钮被按下时触发此事件或者正在下载的文件被中断 ...> ondragend IE5、N 当鼠标拖动结束时触发此事件,即鼠标的按钮被释放了...> ondrop IE5、N 在一个拖动过程中,释放鼠标键时触发此事件
onchange:在元素的元素值被改变时触发。 onfocus:当元素获得焦点时触发。 onreset:当表单中的重置按钮被点击时触发。 ...onselest:在元素中文本被选中后触发。 onsubmit:在提交表单时触发。 3、Keyboard键盘事件 onkeydown:在用户按下按键时触发。 ...onkeypress:在用户按下按键后,按着按键时触发。该属性不会对所有按键生效,不生效的有:ALT、CTRL、SHIFT、ESC onkeyup:当用户释放按键时触发。...onmousedown:当在元素上按下鼠标按钮时触发。 onmousemove:当鼠标指针移动到元素上时触发。 onmouseout:当鼠标指针移出元素时触发。 ...onmouseover:当鼠标指针移动到元素上时触发。 onmouseup:当在元素上释放鼠标按钮时触发。 5、Media媒体事件 onabort:当退出时触发。
事件处理器 想象一下,有一个接口,若想知道键盘上是否有一个键是否被按下,唯一的方法是读取那个按键的当前状态。为了能够响应按键动作,你需要不断读取键盘状态,以在按键被释放之前捕捉到按下状态。...,但当持续按下某个按键时,会循环触发该事件。...鼠标点击 点击鼠标按键会触发一系列事件。"mousedown"事件和"mouseup"事件类似于"keydown"和"keyup"事件,当鼠标按钮按下或释放时触发。...当事件发生时,由鼠标指针下方的 DOM 节点触发事件。 在mouseup事件后,包含鼠标按下与释放的特定节点会触发"click"事件。...为此,我们可以使用buttons属性(注意复数形式),它告诉我们当前按下的按键。 当它为零时,没有按下按键。 当按键被按住时,其值是这些按键的代码总和 - 左键代码为 1,右键为 2,中键为 4。
有没有想过只需按住一个按钮几秒钟就能在你的 Vue 应用中触发一个功能? 有没有想过创建一个按钮,按下一次就可以清除单次输入(或者持续按住可以清除所有输入)? 想过?太好了,英雄所见略同。...原理 要实现长按,用户需要按下并按住按钮几秒钟。 想通过代码模拟这一效果,我们需要在鼠标“点击”按下按钮时,启动一个计时器监听用户按下的时长,如果时间超过我们期望的时长,就执行相应的函数。 非常简单!...如何实现 当用户点击按钮时,在点击事件之前会触发另外两个事件: mousedown 和 mouseup。 当用户按下按钮时触发 mousedown 事件,用户松开按钮时调用 mouseup 事件。...我们需要做的是: mousedown 事件触发时,启动计时器。 一旦 mouseup 事件在预期的 2 秒前被触发,就清除计时器,不要执行相应的函数。就当作一个普通的点击事件。...只要计时器在我们预设的时间内没有被清除,即 mouseup 事件没有被触发——那么可以断定用户没有释放按钮。因此,可以判定为一次长按,可以执行关联的函数。 实践 让我们深入代码,完成这一功能。
“此对象”表示被添加了这个事件的对象 与jquery和js一致,事件的回调函数第一个参数会带上事件对象,在easeljs文档event类中可以看到各个事件属性的说明。...到其它容器对象时触发 click 继承自 DisplayObject 加入版本 0.6.0 在用户按下左键并在此对象上松开左键后触发。...stagemousedown 定义于 stage 加入版本 0.6.0 用户在canvas上按下左键后触发。...stagemousemove 定义于 stage 加入版本 0.6.0 当用户在canvas上移动鼠标时持续触发。...stagemouseup 定义于 stage 加入版本 0.6.0 当用户在stage的某处按下左键,然后在页面中能接收事件的任意一处(不同浏览器有些不同)松开左键。
与 click 不同,只要鼠标在元素上松开即触发(左右键都行)。mousedown:鼠标在元素上并按下时触发 mousedown 事件。与 click 不同,只要鼠标在元素上按下即触发(左右键都行)。...mouseenter:当鼠标位于元素上时触发 mouseenter 事件,通常与 mouseleave 配合使用。mousemove:鼠标在元素上移动时触发 moudemove 事件。...区别点:mouseenter不会冒泡,简单的说,它不会被它本身的子元素的状态影响到.mouseover就会被它的子元素影响到,在触发子元素的时候,mouseover会冒泡触发它的父元素....》mouseup-》click-》blurmousedown、mouseup、click若在同一个元素上按下并松开鼠标左键,会依次触发mousedown、mouseup、click,前一个事件执行完毕才会执行下一个事件若在同一个元素上按下并松开鼠标右键...0:没有键被按下1:按下左键2:按下右键3:左键与右键同时被按下4:按下中键5:左键与中键同时被按下6:中键与右键同时被按下7:三个键同时被按下参考文章:JS鼠标事件(非常详细) http://c.biancheng.net
领取专属 10元无门槛券
手把手带您无忧上云