js 如何判断鼠标点击事件还是js代码调用
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试用户点击和js点击</title>
<script src='jquery-1.10.2.min.js'></script>
</head>
<body>
<button id="btn">Click</button>
<script>
// 来源:http://www.zhihu.com/question/31259853
$(document).ready(function(){
// 方式1
a();
// 方式2
// b();
// b2();
// 方式3
// c();
// 方式1:btn.click.caller
function a() {
var btn = $('#btn');
// 赋予事件
btn.click(function() {
console.log(btn.click.caller);
if(null === btn.click.caller) {
// 用户点击的
alert('用户点击了');
}else {
// JS代码调的
alert('JS点击了');
}
});
btn.click();
}
// 方式2: e.originalEvent(jquery)
function b(){
var btn = $('#btn');
// 赋予事件
btn.click(function(event) {
// event.originalEvent => MouseEvent
if(event.originalEvent) {
// 用户点击的
alert('用户点击了');
}else {
// JS代码调的
alert('JS点击了');
}
});
btn.click();
}
// 方式2:pageX, clientX(原生js),也阔以是offsetX/layerX/screenX
function b2(){
// 原生js实现
var btn2 = document.getElementById('btn');
// DOM0级事件实现
btn2.onclick = function(event){
if (event.pageX){
alert('用户点击了');
}else{
alert('JS点击了');
}
}
btn2.click();
}
// 方式3: event.isTrusted IE9+/firefox支持
function c(){
var btn = $('#btn');
// 赋予事件
btn.click(function(event) {
// event.originalEvent => MouseEvent
if(event.isTrusted) {
// 用户点击的
alert('用户点击了');
}else {
// JS代码调的
alert('JS点击了');
}
});
btn.click();
}
});
</script>
</body>
</html>
js 如何判断鼠标点击事件还是js代码调用的更多相关文章
- JS控制鼠标点击事件
鼠标点击事件就是当鼠标点击元素时,就会出现另一个窗口,类似于百度首页中右上角的“登录”这个按钮,当鼠标点击 登录时,就会出现登录窗口.大体的意思就是这样,直接上代码了,简单易懂. <!DOCTY ...
- JS如何判断鼠标滚轮向上还是向下滚动
前几天偶然看到某前端群有人在问:JS如何判断鼠标滚轮向上还是向下滚动? 我想了想,有点蒙蔽,心想难道不是用scrollTop来判断吗? 但我不确定,也出于好奇心,于是开始了一番探索 思路:通过even ...
- css禁用鼠标点击事件
css禁用鼠标点击事件 .disabled { pointer-events: none; } <div class="main-container disabled"> ...
- MacOS获取辅助功能权限控制鼠标点击事件
昨晚玩一个模拟经营的游戏,由于升级太慢我就不停的种树卖树来换取经验值.不过重复点击10几分钟后,实在受不了.网上本来准备找个鼠标自动点击的软件用用.结果没找到趁手的.如是自己写了个. 自己设置需要点击 ...
- Echarts如何添加鼠标点击事件?防止重复触发点击事件
Echarts如何添加鼠标点击事件? 1.通常我们只使用了以下代码,通过配置项和数据显示图表. var myChart = echarts.init(document.getElementById(' ...
- 使用原生JS,实现鼠标点击爱心效果 !!!
使用原生JS,实现鼠标点击爱心效果 !!! 引言: 在很多时候我们都需要实现鼠标点击出现图案或者文字这样的效果,对于用户而言,这样的体验是很极致的.其实实现起来也很简单,下面一起来学习一下吧.文末附上 ...
- vue表单验证不通过,依然能执行点击事件里面的代码?
遇到的问题:表单提交的时候,写了rules,明明验证不通过依然执行了点击事件里面的代码. 这个验证有什么用? 后来 我看elementUI组件才发现,我漏写了几行代码. methods里面这样写 完美 ...
- js提交数据时需判断是点击事件还是回车键
使用回车键实质还是点击事件==回车时将焦点聚居在某个标签上. Html代码: <div id="btlogin" class="btlogin">& ...
- js中判断鼠标滚轮方向的方法
前 言 LiuDaP 最近无聊,在做自己的个人站,其中用到了一个关于鼠标滚轮方向判断的方法,今天闲来无聊,就给大家介绍一下吧!!!! 在介绍鼠标事件案例前,让我们先稍微了解一下js中的event ...
随机推荐
- margin:0 auto在ie7浏览器里面无效
把文件头改成 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w ...
- nginx及php版本号隐藏
配置完一台服务器后,并不是就可以高枕无忧了,前不久刚刚爆发的PHP 5.3.9版本的漏洞也搞得人心惶惶,所以说经常关注安全公告并及时升级服务器也是必要的.一般来说,黑客攻击服务器的首要步骤就是收集信息 ...
- Xcode如何简单安装Alcatraz
1.最简单直接,直接到github获取该项目 地址:www.github.com,搜索Alcatraz: 2.通过Xcode打开该项目,编译success后,退出Xcode,再启动,再弹出框选择loa ...
- C#入门经典(第五章-1)
- 简单的js实现网页时钟
js实现时钟. <div id="clock"></div> <script type="text/javascript"> ...
- SPFA中 正逆邻接表的建立
正邻接表的建立: 先定义一个结构体: struct node { int r,v,w,next; }Map[]; 每输入一组数据 就通过Add函数加入到邻接表中,上图已经说得很明白了,结合着下面的代码 ...
- 1084:XX开公司<回溯>
Description 2020年,xx开了一家拥有N个员工的大公司.每天,xx都要分配N项工作给他的员工,但是,由于能力的不同,每个人对处理相同工作所需要的时间有快有慢.众所周知,xx是一个非常重视 ...
- HDU 1883 Phone Cell(计算几何)
方法:选取一个点A,以点A为圆心做一个半径为r的圆,然后枚举另一个点B,以B为圆心做一个圆,如果这两个圆有交集,那我们在这个交集内选取一个点做半径为r的圆,这个圆就包括了A和B点,找到交集最多的区域并 ...
- Apache下的FileUtils.listFiles方法简单使用技巧
一.引言 Apache提供的很多工具方法非常好用,推荐. 今天在使用的过程中使用到了org.apache.commons.io.FileUtils.listFiles方法,本文主要谈谈这个工具方法的用 ...
- python之路: 线程、进程和协程
进程和线程 既然看到这一章,那么你肯定知道现在的系统都是支持“多任务”的操作,比如: Mac OS X,UNIX,Linux,Windows等. 多任务:简单地说就是同时运行多个任务.譬如:你可以一边 ...