Question

我的菜单的工作方式如下：每个菜单项（例如，下面的菜单项1）位于另一个<td>内嵌套的表中的<td>。外<td>有一些onclick事件处理程序（此处称为“processMenuClick（）”）。

<td onClick="processMenuClick(<item-dependent-arguments>);">
    <table>
        <tr>
            <td class="innermenuitem">Menu Item One</td>
       </tr>
    </table></td>

在某些情况下，我希望阻止菜单响应点击次数。为了测试它是如何工作的，我制作了两个按钮。一个将event.stopPropagation应用于类“innermenuitem”的每个<td>，如下所示：

<button onclick="javascript:stopit()">Test the disable menu functionality</button>

<script type="text/javascript">
function stopit()
{
    $("td.innermenuitem").click(function(event)
    {
        event.stopPropagation();
    })
}
</script>

这似乎很有效。当我单击按钮时，菜单停止响应点击。但现在说我想重新启用菜单。点击处理程序在外部<td>中仍未受干扰。所以我希望我的第二个按钮禁用我已应用于内部<td>的stopPropagation。那有意义吗？如果是这样，它是如何完成的？

注意：请注意，上面的内容应该允许我禁用菜单并重新启用它，而不必将外部<td>重新绑定到其处理程序。这很重要，因为传递给“processMenuClick（）”的参数只在服务器上是已知的。如果我必须重新绑定处理程序，我将不得不想办法通过某种回发来回忆它们。但我认为，因为我所做的一切都是停止从内部<td>冒出事件，假设有一种方法可以解决这个问题（并允许事件再次冒泡）我应该是金色的。但是阅读其他线程看起来像stopPropagation只用于一个事件，而不是像我想的那样，这基本上就像<td>上的“状态”。有人可以让我直截了当吗？（并希望解决我在这里仔细描述的问题？）谢谢。

Paragram

Answer 1

function startIt(){
     $('td.innermenuitem').off('click');
}

停止它应该与on方法绑定，以使其尽可能简单。

function stopIt(){
    $('td.innermenuitem').on('click', function(event){
       event.stopPropagation();
    });
}

Answer 2

还有一种没有jQuery的方法：
dataSend发送ajax请求
在 onclick 中，您可以访问事件所以在通话结束后，冒泡停止了 event.stopPropagation（）;
没有stopPropagation div中的click事件＆＃39; 1＆＃39;也将被激活

<div id='1' class='mnb_bookinfo' 
onclick='dataSend(cBookInfo,34)';>

<div id='2' class='mnb_bookedit' 
onclick="dataSend(cBookEdit,34);event.stopPropagation();">
<img src='misc/mnb/icon_edit.svg' width=32 height=32>
</div>

</div>

关于事件冒泡和停止传播然后允许冒泡的困惑

2 个答案: