Question

我正在创建带有可搜索选择的自定义模板。输入元素上有focus (trigger)，blur (trigger)，keyup (delegate)和value (bind)绑定。下拉内容显示在此输入所在的div内的div中。当焦点位于输入框时，将显示该下拉列表，但是当我单击自定义下拉列表中的一个元素时，模糊事件会在单击委托触发之前触发，因此，我没有收到{ {1}}方法。

模板如下：

selectThis()

我如何才能先触发click元素，而又不会因超时和其他内容而对其进行入侵...？ -我曾尝试在包含<template> <require from="../searchabledropdown/searchabledropdown.css"></require> <div class="dropdown"> <input type="text" placeholder="Search.." id="inputSearchField" value.bind="searchValue" keyup.delegate="findData()" focus.trigger="changeVisibility(true)" blur.trigger="changeVisibility(false)"> <div if.bind="visible" class="dropdown-content"> <a href="${'#' + option.thingId}" click.delegate="selectThis(option.thingId)" repeat.for="option of thingimabobs">${option.textValue}</a> </div> </div>的{{1}}上设置blur.trigger，但那时它根本不会触发...

Answer 1

要使click事件触发元素2，需要发生的事情。

单击开始时，鼠标需要位于该元素上。
单击结束时，鼠标需要位于该元素上。

您会注意到，开始单击某个元素，然后在单击时将鼠标移离该元素，然后将鼠标释放到该元素外。在这种情况下，click事件将不会触发。

但是，如果您开始单击该元素，然后-在按住鼠标的同时-走出了-但是再次进入并释放了鼠标-然后会触发click事件。

在您的情况下-从未满足第二个要求-因为在释放鼠标时-blur事件已经触发并且使元素消失-因此元素没有捕获鼠标的释放

TL; DR

只需将您的事件从click更改为mousedown-然后，当您单击该元素时，代码将立即触发。

http://codingrepo.com/javascript/2017/05/19/javascript-difference-mousedown-mouseup-click-events/

Aurelia事件触发顺序

1 个答案: