Question

我有一个下拉菜单（不是HTML中提供的选择菜单，而是一个基于 div，显示另一个div 的自定义菜单），当它点击时会动态加载。然后用户可以从中选择一些选项。

现在，我希望能够以编程方式触发某些菜单选项。所以基本上：

$("#menu").trigger("click"); // open the menu
$("#menu").find("....").click(); // find the desired option in the menu who's just been loaded after "artificial" click.

这里的问题是jQuery没有立即触发第一次点击。事实上，我尝试了 console.log（），并且没有找到任何对象（打印了 prevObject ）。如果我设置了一个超时，那么它可以正常工作，但当然这只是一个＆＃34;希望它可以工作＆＃34;解决方法。

解决方案有点像：

trigger("click, function(){ 
   // second trigger here
});

有任何线索吗？

Answer 1

由于内容是动态加载的，我认为您需要委派的事件：

$(document).on('click', '#menu', function() {

$(this).find("....").trigger('click');
});

或类似的东西，至少（小提琴或更多代码会有所帮助）......

编辑 - 必须有十几种方法来解决这个问题，如果你一步一步地定义应该发生的事情（添加动态内容然后在其上绑定点击事件），看起来你甚至不需要委托事件。但是，这是一种方法，可以在一个方法链中完成（第一位添加一些内容）：

$('#menu').one('click', function() {
$('<div id="content"></div>').appendTo('#menu');
});

$('#menu').on('click', '#content', function() {
console.log('new content clicked');
});

$('#menu').trigger('click').find('#content').trigger('click');

http://codepen.io/anon/pen/OPYgoZ?editors=001

我的结论是，除非动态添加#menu，否则不应该委托事件。链接方法应该有效......代理将需要检测新元素的触发器。如果外部/更大的内容影响任何事情，也会尝试，但事实并非如此。

我从中获得的只是另一行代码，以防您在触发点击之前等待内容加载：

$('#menu').trigger('click').find('#content').on('load', function() {$(this).trigger('click')});

Answer 2

尝试使用.on（＆＃39;点击＆＃39;，function（）），而不是单击菜单的内部点击。

触发一个事件后如何执行函数？

2 个答案: