未捕獲的TypeError：$（...）。tabs不是函數

Question

我認為jquery有一個奇怪的問題，當這里的頁面加載是我的標記時，我得到了這個異常：

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<link href="../Layouts/en-us/css/custom.css" rel="stylesheet" />

<link href="../Layouts/en-us/css/jquery-ui.css" rel="stylesheet" />



<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="../ckeditor/ckeditor.js"></script>
<script src="../ckeditor/adapters/jquery.js"></script>
<script src="/Layouts/en-us/js/jquery-ui.min.js"></script>
</asp:Content>

這是導致錯誤的函數

$(function () {
    $("#tabs").tabs();

    if ($("#ListBoxPages").val() == null) {
        $("#tabs").css("display", "none");
    }

    $("#ListBoxPages").change(function () {
        $("#tabs").css("display", "block");
    });

});

Layouts和jquery的所有相對路徑都是從另一個標記復制而來的，該標記工作得非常好，沒有錯誤

Answer 1

我可以看到你正在加載jquery兩次，所以嘗試刪除它

<script src="/Layouts/en-us/js/jquery-ui.min.js" />

並保持 -

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" />

然后使用下面的代碼代替你的函數（首先檢查這個函數的變化，然后嘗試刪除那個jquery-ui.min.js）

$( document ).ready(function() {
        $("#tabs").tabs();
        if ($("#ListBoxPages").val() == null) {
            $("#tabs").css("display", "none");
        }
        $("#ListBoxPages").change(function () {
            $("#tabs").css("display", "block");
        });
});

Answer 2

$（ “＃標簽”）選項卡（）。 需要Jquery.UI只包括

<script src="/Layouts/en-us/js/jquery-ui.min.js" />

或使用CDN

<scriptsrc="https://code.jquery.com/ui/1.12.1/jquery-ui.js"integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="crossorigin="anonymous"></script>