Javascript/jquery无意中循环，按钮onclick事件

我有几个按钮，当您单击（onclick）时会显示一个包含4个选项的菜单（如右键单击任何软件）：

客人姓名3

以及名为onclick的方法：

function mouseDown(e,id){
//e = e || window.event;
if(e.which === 1){
    console.log(e);
    $("#menu").css({'display':'block', 'left':e.pageX, 'top':e.pageY});
}

//controlamos los botones del menú
$("#menu").click(function(e){
    // El switch utiliza los IDs de los <li> del menú
    switch(e.target.id){
        case "AddBooking":
            $("#bookingModal").modal();
            break;
        case "CheckIn":
            console.log('a');
            //$("#bookingModalcheck").modal();
            //checkinRoom(id);
            break;
        case "Move":
            console.log('a');
            $("#Move-dialog").modal();
            $("#move-original-room").attr('value', id);
            break;
        case "Remove":
            // Método cancelar
            cancelRoom(id);
            break;
    }
});}

函数mouseDown（e，id）{
//e=e | | window.event；
如果（e.which==1）{
控制台日志（e）；
$（“#菜单”）.css（{'display'：'block'，'left'：e.pageX，'top'：e.pageY}）；
}
//曼努博通控制酒店
$（“#菜单”）。单击（功能（e）{
//El switch utiliza los IDs de los
del menú
开关（如target.id）{
案例“AddBooking”：
$（“#bookingModal”）.modal（）；
打破
案例“签入”：
console.log（'a'）；
//$（“#bookingModalcheck”）.modal（）；
//登记室（id）；
打破
案例“移动”：
console.log（'a'）；
$（“#移动对话框”）.modal（）；
$（“#移动原始房间”）.attr（'value'，id）；
打破
“删除”案例：
//Método cancelar
取消房间（id）；
打破
}
});}

问题是，如果我用相同的方法多次单击其他按钮，然后访问菜单并按下其中一个选项，例如chekin，则会重复开关的案例检入，重复次数与之前单击其他按钮的次数相同。这就好像点击将被存储

我很想知道为什么会这样

添加预览视频：

---

您正在注册click listener多次，因此它被称为多次。尝试：

$("#menu").off('click').on('click', function(e){
// El switch utiliza los IDs de los <li> del menú
switch(e.target.id){
    case "AddBooking":
        $("#bookingModal").modal();
        break;
    case "CheckIn":
        console.log('a');
        //$("#bookingModalcheck").modal();
        //checkinRoom(id);
        break;
    case "Move":
        console.log('a');
        $("#Move-dialog").modal();
        $("#move-original-room").attr('value', id);
        break;
    case "Remove":
        // Método cancelar
        cancelRoom(id);
        break;
}
});

$（“#菜单”）.off（'click'）.on（'click'，函数（e）{
//El switch utiliza los IDs de los
del menú
开关（如target.id）{
案例“AddBooking”：
$（“#bookingModal”）.modal（）；
打破
案例“签入”：
console.log（'a'）；
//$（“#bookingModalcheck”）.modal（）；
//登记室（id）；
打破
案例“移动”：
console.log（'a'）；
$（“#移动对话框”）.modal（）；
$（“#移动原始房间”）.attr（'value'，id）；
打破
“删除”案例：
//Método cancelar
取消房间（id）；
打破
}
});

.off（'click'）取消注册所有当前单击处理程序，然后分配所需的。 祝你好运

$("#menu").off('click').on('click', function(e){
// El switch utiliza los IDs de los <li> del menú
switch(e.target.id){
    case "AddBooking":
        $("#bookingModal").modal();
        break;
    case "CheckIn":
        console.log('a');
        //$("#bookingModalcheck").modal();
        //checkinRoom(id);
        break;
    case "Move":
        console.log('a');
        $("#Move-dialog").modal();
        $("#move-original-room").attr('value', id);
        break;
    case "Remove":
        // Método cancelar
        cancelRoom(id);
        break;
}
});