Javascript Onclick函数一次单击触发两次

我的剃须刀中有一个

foreach

：

<ul>
    @foreach (var node in Model)
    {
        var par = node.Id;
        <li onclick="GetSubMenu(this)" id="@node.Id">
            @node.Title
        </li>
    }
</ul>

---

第一次一切正常，子菜单将正确显示，但在第二次单击子菜单时，再次单击子菜单和父菜单的onclick函数调用，问题是什么？

问题是，当单击子元素时，它正在为子元素和父元素调用

onclick

事件，因为子元素包含在父元素中

您可以使用jQuery

stopPropogation

方法停止冒泡事件。此方法防止事件在DOM树中冒泡，从而防止任何父处理程序收到事件通知

将代码转换为不引人注目的javascript

<li class="menuItem" id="@node.Id">
     @node.Title
</li>

确保在ajax方法的

done

事件（具有相同css类的事件）中为子元素构建相同类型的标记

---

问题是，当您单击子元素时，它正在调用子元素和父元素的

onclick

事件，因为子元素包含在父元素中

您可以使用jQuery

stopPropogation

方法停止冒泡事件。此方法防止事件在DOM树中冒泡，从而防止任何父处理程序收到事件通知

将代码转换为不引人注目的javascript

<li class="menuItem" id="@node.Id">
     @node.Title
</li>

确保在ajax方法的

done

事件（具有相同css类的事件）中为子元素构建相同类型的标记

---

您需要停止

单击
事件的传播。您可以通过对该事件调用
stopPropagation（）
函数来实现这一点。例如：
函数GetSubMenu（event，e）{…event.stopPropagation（）；}
，
。。。。onclick=“GetSubMenu（event，this）”……
您是说它在加载子菜单后再次请求它吗？一旦触发，您是否尝试从父菜单解除单击事件的绑定？另一种方法是向父菜单添加检查，查看子菜单是否已加载。我的意思是，当
onclick
触发求和菜单时，它也会触发其所有父菜单，如何解决此问题？您需要停止
click
事件的传播。您可以通过对该事件调用
stopPropagation（）
函数来实现这一点。例如：
函数GetSubMenu（event，e）{…event.stopPropagation（）；}
，
。。。。onclick=“GetSubMenu（event，this）”……
您是说它在加载子菜单后再次请求它吗？一旦触发，您是否尝试从父菜单解除单击事件的绑定？另一种方法是在父菜单中添加一个检查，查看子菜单是否已经加载。@i我的意思是当
onclick
为sum菜单启动时，它也会为它的所有父菜单启动，我如何解决这个问题？我按照u所说的做，但这次onclick函数只是为父节点调用，当我点击子节点时，函数再次调用它的父节点！！不！它应该很好用。在这里看到正在工作的js fiddle，我按照u所说的做了，但是这次onclick函数只是调用了父节点，当我单击子节点时，该函数再次调用了它的父节点！！不！它应该很好用。看到这里的工作js小提琴了吗
<li class="menuItem" id="@node.Id">
     @node.Title
</li>

$(function(){

   $(document).on("click",".menuItem",function(e){
       e.stopPropagation();

       var id=$(this).attr("id");
       ///Do your ajax call here
   });

});