0

我正在努力寻找构建以下内容的“正确”方法。

我有一个 td 单元格，其中有一个标题，（在一个更大的表格中）。这个 td 有一个点击事件来打开一个子菜单。我已经在这个标题上使用 jEditable 实现了内联编辑，包装在一个 div 类中。

简化：

<tr>  
....
  <td class="menuopener"><div class="editable">TITLE</div></td> 
...
</tr>

我将 div 设置为触发 DblClick 上的 jEditable。

由于这个 div 占据了整个单元格，所以 menuopener click 事件永远不会触发。

如果我将 div 更改为 display:inline，我可以获得单元格的“剩余部分”以获取菜单开启器触发器。

但是当我双击时，我不想打开菜单，因为这不是用户现在想要做的......他们想要更新标题。

那么，做到这一点的“最佳”方法是什么……不一定是代码方面的，而是人为因素方面的。延迟跟踪器是一个想法吗？将菜单更改为在双击时触发并在单次上进行编辑，但同样的问题只是向后......

想法？

4

1 回答 1

0

无论标题的大小如何，事件都会冒泡。当您的标题双击侦听器触发时，菜单打开器的单击侦听器将始终首先触发两次。演示。

如果点击目标是您的标题，则您需要将菜单打开器限制为您的双击阈值。

$('.menuopener').click(function(e) {
    var delay = $(e.target).is('.editable') ? 200 : 0;
    window.clearTimeout(window.openMenuTimeout);
    window.openMenuTimeout = window.setTimeout(function() {
       // your menu opener code
    }, delay);
});

$('.editable').dblclick(function(e) {
    window.clearTimeout(window.openMenuTimeout);
    // your editable code
});

演示

在后一个示例中，您可能确实希望使您inline-block的.editable.

于 2013-04-10T14:43:23.883 回答