jquery.hotkeys.js从包含插件之前运行良好的代码中获取类型错误

Question

如上所述，我添加插件后只会收到此错误

<script type="text/javascript" src="jquery.hotkeys-master/jquery-1.4.2.js"></script>

https://github.com/jeresig/jquery.hotkeys

之前脚本没有问题。

错误是TypeError: $(...).on is not a function。

我会在需要的时候包含整个脚本（错误是针对单独代码的顶行）;

<script>

    $(document).ready(function(){

        ctr = $("#container");

        var hoverBox = $(".box").mouseenter();

        var firstRow = function() {
            var brk = $("<div class='break'></div>");
            for(var i = 0; i < 16; i++) {
                ctr.append("<div class='box'></div>");
            }
            brk;
        };

        var firstGrid = function() {
            for(var i=0;i<16;i++) {
            firstRow();
            }
        };

        var colorBoxes = function() {
            $(".box").on("mouseenter", function() {
                $(this).css({"background-color":"#C6D4E1"});
            }); 
        };

        var clearGrid = function() {
            $(".box").remove();
        };



        //!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
        $(".defaultGen").on("click", function() {
            clearGrid();
            firstGrid();
            colorBoxes();
            changeColor();
        });
        //^^^^^^^^^^^^^^^^^^^^^^^^^^^^^



        var changeColor = function() {
            $("#chooseColor").on("click", function() {
                var chosenColor = $(".color").val();
                    $(".box").on("mouseenter", function() {
                        $(this).css({"background-color":"#"+chosenColor});
                    });
            });
        };

        //omg this is awesome...I love coding!

        $(".choose").on("click", function() {
            var numBoxesPerRow = prompt("How many boxes would you like per row?");
                if(numBoxesPerRow > 25) {
                    alert("Sorry, the number of boxes per row has to be 25 or less.  Do you think boxes grow on trees or something?");
                }
                else if(numBoxesPerRow <= 1) {
                    alert("One box does not a sketch make :P.");
                }
                else if(isNaN(numBoxesPerRow)) {
                    alert("That ain't a number I ever heard of! ;)");
                }
                else {
                    var userGenRow = function() {
                        var boxLength = (640/numBoxesPerRow)+"px";
                        for(var i=1;i<=numBoxesPerRow;i++) {
                            ctr.append("<div class='box'></div>");
                            $(".box").css({"width":boxLength, "height":boxLength});
                        }
                    };
                    var userGenGrid = function() {
                        for(var i=1;i<=numBoxesPerRow;i++) {
                            userGenRow();
                        }
                    };
                    clearGrid();
                    userGenGrid();  
                    colorBoxes();
                    changeColor();
                }
        });

        $(".toggleBorders").on("click", function() {
            $(".box").toggleClass("borders");
        });

        $(".color").click(function() {
            $("p").css({"color":"#44749D"});
        });

        $("#togglePaint").on("click", function(){
            $(hoverBox).remove
        });

        $("#paintOff").on("click", function(){
            $(".box").off();
        });

        $("#paintOn").on("click", colorBoxes);
        $("#paintOn").on("click", changeColor);
    });

</script>