javascript - 事件多次发生

Question

我已经实现了右键单击上下文菜单。在我的菜单上，我有一个按钮，按下它时我会出现 console.log("button is clicked"); 消息。

我面临的问题是，第一次点击时，我收到消息1次。第二次，只需单击一下，我就会收到消息2次。诸如此类...

下面是我的 jquery 代码:

$(document).on("contextmenu", function(event) {
    if ($(event.target).hasClass("sim-row-edit")) {  // sim-row-edit ended
        console.log("right click identified");
        .....
        // no problem in here
        // multiple occurance problem coming here
        $(".custom-menu li").click(function() {
            switch ($(this).attr("data-action")) {
                case "firstcase":
                    var thisDiv = target_element.closest('div');
                    console.log("Button is clicked");
                break;
                case "nextcase":
                ...

        $(document).on("mouseup", function() {
            $(".selected").removeClass("selected");
            $(".custom-menu").hide(100);
        });

html代码:

<ul class='custom-menu'>
    <li data-action = "first">Clone</li>
    <li data-action = "second">Remove</li>
    <li data-action = "third">Edit</li>
</ul>

如何解决这个问题？

Answer 1

尝试这个event.stopPropagation():

$(".custom-menu li").click(function(e) {
  e.stopPropagation();
  switch ($(this).attr("data-action")) {
    case "firstcase":
  var thisDiv = target_element.closest('div');
  console.log("Button is clicked");
      break;

case "nextcase":
...

引用:https://api.jquery.com/event.stoppropagation/