jQuery-contextMenu - $.contextMenu 不是函数

Question

我尝试使用 contextMenu 插件，但我得到

$.contextMenu is not a function

。

我像在演示中一样尝试过。

我不知道我做错了什么。

$(function() {
        $.contextMenu({
            selector: '.context-menu-one', 
            callback: function(key, options) {
                var m = "clicked: " + key;
                alert(m); 
            },
            items: {
                "edit": {name: "Edit", icon: "edit"},
                "cut": {name: "Cut", icon: "cut"},
               copy: {name: "Copy", icon: "copy"},
                "paste": {name: "Paste", icon: "paste"},
                "delete": {name: "Delete", icon: "delete"},
                "sep1": "---------",
                "quit": {name: "Quit", icon: function(){
                    return 'context-menu-icon context-menu-icon-quit';
                }}
            }
        });

        $('.context-menu-one').on('click', function(e){
            console.log('clicked', this);
        }); 
});

<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/swisnl/jQuery-contextMenu/master/src/jquery.contextMenu.js"></script>




<span class="context-menu-one btn btn-neutral">right click me</span>

Answer 1

代码必须在 jquery 之外（示例未在文档中准备好）

这个示例代码对我有用

 <link rel="stylesheet"
            href="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.8.0/jquery.contextMenu.min.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
        <script type="text/javascript"
            src="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.8.0/jquery.contextMenu.min.js"></script>

(function($) {
        $(document).ready(function() {
            var cutRow = null;
            // Your code that uses $.contextMenu
            $.contextMenu({
                selector: '#R-T1',
                callback: function(key, options) {
                    if (key === "cut") {
                        cutRow = $(this).detach();
                    } else if (key === "paste") {
                        if (cutRow) {
                            $("#requirement").append(cutRow);
                            cutRow = null;
                        }
                    }
                },
                items: {
                    "edit": {name: "Edit", icon: "edit"},
                    "cut": {name: "Cut", icon: "cut"},
                    "copy": {name: "Copy", icon: "copy"},
                    "paste": {name: "Paste", icon: "paste"},
                    "delete": {name: "Delete", icon: "delete"},
                    "quit": {name: "Quit", icon: function(){
                        return 'context-menu-icon context-menu-icon-quit';
                    }}
                }
            });
        });
    })(jQuery);