jQuery的load（）方法使一個jQuery插件錯誤

我有以下頁面：jQuery的load（）方法使一個jQuery插件錯誤

<body> 
    <div id="menuBar"> </div> 
    <canvas id="myCanvas" width="700" height="700" style="border:1px solid #000000;"></canvas> 
</body> 

<script src="../Scripts/jQuery.mazeBoard.js"></script> 
<script> 
    $(document).ready(function() { 
    var mazeArray = ... 
    $("#menuBar").load("/Views/UpperMenu.html"); 
    $("#myCanvas").mazeBoard(mazeArray); 
    }) 
</script>

mazeBoard是mazeBoard.js定義的jQuery插件：

(function ($) { 

    $.fn.mazeBoard = function (mazeData) { 

     this.element = $(this)[0]; 
     var context = this.element.getContext("2d"); 

     draw on canvas... 

     return this; 
    } 
})(jQuery);

奇怪的是，除非我刪除的行$("#menuBar").load("/Views/UpperMenu.html")我收到「mazeboard不是函數」錯誤。該行被刪除時，此錯誤消失。

來源

2017-06-16 user1767774

無法複製，https://jsfiddle.net/v6exkas9/ – gauravmuk

嘗試更改jquery庫的另一個版本..它解決了你的問題.. –

我得到了同樣的錯誤。 jonLuci，只有當該行沒有被評論時，我纔會收到錯誤。 – user1767774

很難說爲什麼會出現這個錯誤，但可能與是異步的。

最簡單的辦法是嘗試交換兩個行的順序：

$(document).ready(function() { 
    var mazeArray = ... 
    $("#myCanvas").mazeBoard(mazeArray); 
    $("#menuBar").load("/Views/UpperMenu.html"); 
});

如果不工作，那麼你就可以初始化.mazeBoard()前等待的完成：

$(document).ready(function() { 
    var mazeArray = ...; 
    $("#menuBar").load("/Views/UpperMenu.html", function() { 
     $("#myCanvas").mazeBoard(mazeArray); 
    }); 
});

來源

2017-06-16 12:26:40

謝謝，第二個解決方案解決了這個問題。 – user1767774

jQuery的load（）方法使一個jQuery插件錯誤

回答

相關問題