jquery判断是用户鼠标点击事件还是jquery的trigger事件

最新推荐文章于 2022-06-17 10:45:36 发布

序猿_

最新推荐文章于 2022-06-17 10:45:36 发布

阅读量4.6k

点赞数 1

分类专栏： WEB 文章标签： javascript

本文链接：https://blog.csdn.net/huangchao064/article/details/70768134

版权

WEB 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<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>
      $(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>