Question

我正在尝试编写一些Javascript，当单击div时，使用该divs ID的参数调用函数，该功能在我刚刚发送硬编码的div ID时起作用：

$('#areaOne').on('show.bs.collapse', onSectionClick('#areaOne'));


function onSectionClick(){
    var x = $('#areaOne).hasClass('toggled') ? 'false' : 'true';
    console.log(x)
}

然而，当我这样尝试时：

  $('#areaOne').on('show.bs.collapse', onSectionClick('#areaOne'));


  function onSectionClick(secID){
    var x = $(secID).hasClass('toggled') ? 'false' : 'true';
    console.log(x)
  }

然后在加载页面时立即调用该函数，而不是在单击该区域时调用该函数。我希望它以这种方式工作，因为有许多区域应该触发相同的功能。

我对Javascript很陌生，所以任何帮助，或者如何以更好的方式做到这一点的建议将不胜感激。

Answer 1

问题是你调用函数而不是给出函数引用。尝试：

 $('#areaOne').on('show.bs.collapse', function(){onSectionClick('#areaOne')});

Answer 2

行

$('#areaOne').on('show.bs.collapse', onSectionClick('#areaOne'));

调用 onSectionClick，传递'#areaOne'，并将其返回avlue 传递给on，完全按照{{1}的方式传递} 调用 foo(bar())并将其返回值传递给bar。

如果要将其设置为由事件调用，则传递函数引用而不是调用函数，例如：

foo

但是，在你的情况下，你可能甚至不想这样做。代替：

$('#areaOne').on('show.bs.collapse', function() { onSectionClick('#areaOne'); });

...在$('#areaOne').on('show.bs.collapse', onSectionClick); // Note no () -------------------------------------^中，使用onSectionClick获取所点击元素的ID（this.id - 如果需要，添加'areaOne'。）

如果您还有其他“区域”也需要连接，您可以将它们连接起来：

...然后你知道哪一个与$('selector-for-all-the-areas').on('show.bs.collapse', onSectionClick);中元素this引用的事件有关。

传递div ID时触发事件功能

2 个答案: