Javascript + 区分用户点击和从函数发送的点击

Question

我有一个像这样的 Accordion 函数:

$("#notaccordion").addClass("ui-accordion ui-widget ui-helper-reset")
   .find("h3")
   .addClass("ui-accordion-header ui-helper-reset ui-state-default ui-corner-top ui-corner-bottom")
    .prepend('<span class="ui-icon ui-icon-triangle-1-e"/>')
    .click(function () {
       $(this).toggleClass("ui-accordion-header-active").toggleClass("ui-state-active")
          .toggleClass("ui-state-default").toggleClass("ui-corner-bottom")
          .find("> .ui-icon").toggleClass("ui-icon-triangle-1-e").toggleClass("ui-icon-triangle-1-s");
       if ($(this).next().is(':hidden') == true) {
          ;
          $(this).addClass('active'); $(this).next().slideDown('normal');
       }
       else {
          $(this).removeClass('active'); $(this).next().slideUp('normal');
       }

       //.end().next().slideUp('normal');
       return false;
    })
    .next().addClass("ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom").hide();

单击所有面板功能可一次展开所有面板:

function clickAllPanels() {
   var elm = document.getElementsByTagName('table');
   var i = elm.length; while (i--) {
      clickItem(elm[i]);
    }
}

function clickItem(divObj) {
   if (divObj.click) {
      divObj.click();
   } else if (document.createEvent) {
      var evt = document.createEvent("MouseEvents");
      evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
      var allowDefault = divObj.dispatchEvent(evt);
   }
}

如何让 Accordion .click(function () 函数知道是 clickAllPanels 发送“点击”而不是用户的物理点击。我需要这样做是因为我想更改上下滑动逻辑(如果它来自 clickAllPanels)。

Answer 1

我的方法是使用两个不同的事件名称，一个是“click”，另一个是“forced-click”:

$( ... whatever ... ).bind("click forced-click", function(ev) {
  if (ev.type === "forced-click") {
    // called by programmatic trigger
  }
  // ...
});

当您触发事件时:

$( ... whatever ... ).trigger("forced-click");

我想另一种方法是检查事件对象以查看是否有“originalEvent”属性。如果没有，那么您就知道它是通过编程触发的。就我个人而言，我不喜欢依赖它，因为它没有记录在案。