Question

我在组合框中使用jquery，而我并不是要让界面中的组合框显示出来。萤火虫的错误如下：

TypeError：$未定义：$ .widget（“ui.combobox”，{

我正在使用以下文件jquery.ui.combobox.js：

代码：

$.widget("ui.combobox", {
    options: {
        openDialogButtonText: "+",
        dialogHeaderText: "Add option",
        saveButtonImgUrl: null,
        closeButtontext: "Ok"
    },
    _create: function() {
        var selectBox = $(this.element),
            id = selectBox.attr("id"),
            self = this;

        selectBox.addClass("ui-combobox");
        // create HTML to inject in the DOM
        this.addHtml(id, selectBox);
        // turn dialog html into a JQuery UI dialog component
        this.addDialog(id);

        // @todo set proper button height (roughly equal to select height)

        $("#" + id + "-button-opendialog").bind("click", function() {
            $("#" + id + "-editor-dialog").dialog("open");
        }).button();

        $("#" + id + "-button-save").bind("click", function() {            
            self.addOption(id, selectBox);
        }).button();

        this._init();
        return this;
    },
    addHtml: function(id, selectBox) {
        var imgHtml = "";
        if (this.options.saveButtonImgUrl != null) {
            imgHtml = '<img src="' + this.options.saveButtonImgUrl + '" alt="opslaan" />';
        }
        $('&nbsp;<button id="' + id + '-button-opendialog">' +
            this.options.openDialogButtonText +
            '</button>' +
            '<div id="' + id + '-editor-dialog" class="ui-combobox-editor">' +
            '<input id="' + id + '-newitem" type="text" />&nbsp;' +
            ' <button id="' + id + '-button-save">' +
            imgHtml + ' Opslaan' +
            ' </button>' +
            '</div>').insertAfter(selectBox);
    },
    addDialog: function(id) {
        var options = this.options;
        $("#" + id + "-editor-dialog").dialog( {
            autoOpen: false,
            modal: true,
            overlay: {
                opacity:0.5,
                background:"black"
            },
            buttons: {
                // @todo make button text configurable
                "Ok": function() {
                    $("#" + id + "-editor-dialog").dialog("close");
                    return;
                }
            },
            title: options.dialogHeaderText,
            hide: 'fold'
        });
    },
    addOption: function(id, selectBox) {
        var newItem = $("#" + id + "-newitem");
        // @todo do not allow duplicates
        if (newItem !== null && $(newItem).val().length > 0) {
            // @todo iterate over options and get the highest int value
            //var newValue = selectBox.children("option").length + 1;

            var highestInt = 0;
            selectBox.children("option").each(function(i, n) {
                var cInt = parseInt($(n).val());
                if (cInt > highestInt) {
                    highestInt = cInt;
                }
            });
            var newValue = highestInt + 1;

            var newLabel = $(newItem).val();
            selectBox.prepend("<option value='" + newValue + "' selected='selected'>" + newLabel + "</option>");
            this._trigger("addoption", {}, newValue);
            // cleanup and close dialog
            $(newItem).val("");
            $("#" + id + "-editor-dialog").dialog("close");
        } else {
            this._trigger("addoptionerror", {}, "You are required to supply a text");
        }
    },
    _init: function() {
    // called each time .statusbar(etc.) is called
    },
    destroy: function() {
        $.Widget.prototype.destroy.apply(this, arguments); // default destroy
    //        $(".ui-combobox-button").remove();
    //        $(".ui-combobox-editor").remove();
    }
});

你能帮帮我吗？

Answer 1

消息“$ is undefined”表示在页面的任何位置都没有定义名为“$”的函数。因此，当执行此代码时，它不知道遇到此行时该怎么做。

$ function由jQuery定义。因此，该消息表明它在您的代码执行时尚未加载jQuery库。这可能是为了很多事情

您尚未在页面上包含完整的jQuery库。这可能是因为您忘记了包含它，或者您只包含jQuery的一些扩展，例如jQuery.UI。

如果您不确定，请尝试将以下行添加到HTML中head元素的顶部。确保你没有在这行之前放置任何JS：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
您已包含jQuery但无法加载。这可能是因为您使用的链接不正确。使用Firebug中的Net Panel进行仔细检查。
jQuery包含在您的页面中，但您首先包含了自己的JS。这不起作用，因为在加载jQuery之前不会定义$函数，但是您的代码将首先尝试执行。检查包含JS的顺序，确保jQuery是第一个。

TypeError：$未定义：$ .widget（“ui.combobox”，{

1 个答案: