如何在单击后隐藏或禁用JavaScript上下文菜单中的选项

How to I hide or disable a choice in the context menu in javascript after clicking it?

本文关键字：上下文 JavaScript 菜单 选项 单击 隐藏      更新时间：2023-09-26

我有一个带有 4 个选项的上下文菜单，我想在单击它后隐藏或禁用 1 个选项。 这些是我的脚本片段。单击保存选项后，每当我再次右键单击div 时，我只希望上下文菜单中可用的"移动"选项。拖动是div 类。可能吗？

var menu = [
            {'Move':function(menuItem,menuObject){
                    $(this).css({'backgroundColor':'red'});
                    return true; 
                } 
            },
            {'Save':function(menuItem,menuObject){
                    $(this).css({'backgroundColor':'blue'});
                    return true;
                }
            }
        ];
$(function() {
            $('.drag').contextMenu(menu,{
                showSpeed:500,
                hideSpeed:500,
                showTransition:'fadeIn',
                hideTransition:'fadeOut'
            });
        });

提前致谢

首先，类拖动是父元素的类。所以你必须找到"save"元素的类。假设该类是 .save，然后单击将其删除。这是通过以下代码完成的：

$(".save").click(function{
 $(this).remove();
})

如果再次右键单击，将再次创建元素，并且上述函数将失去其用途。所以在我看来，这是你的问题。

但是为什么在"保存"某些内容后需要隐藏保存按钮？也许用户想要再次保存。

如果我们可以看到演示以了解您尝试实现的应用程序，那将很有帮助。

如果您尝试仅在更改（拖动）的元素上应用规则，则必须在类或保存元素位置的数据库中标记已更改的规则。然后，您可以通过 jquery 选择器仅操作标记（更改）的内容。

if ((.drag).hasClass('.changed')){
  $(".save").css({"visibility: visible"});
}

不要忘记默认隐藏 css 中的元素

.save{visibility: none}
相关文章：