Question

首先，我正在使用MVC WebAPI项目。我的脚本在bundle config中配置，然后在页面上呈现（Index.cshtml）。我正在尝试使用widget工具创建一个JQuery小部件。我用这个内容创建了'test'javascript文件：

$.widget("custom.test", {
    options: {
        value: 0
    },
    _create: function () {
        this.options.value = this._constrain(this.options.value);
        this.element.addClass("test");
        this.refresh();
    },
    _setOption: function (key, value) {
        if (key === "value") {
            value = this._constrain(value);
        }
        this._super(key, value);
    },
    _setOptions: function (options) {
        this._super(options);
        this.refresh();
    },
    refresh: function () {
        var testVal = this.options.value + "%";
        this.element.text(testVal);
        if (this.options.value == 100) {
            this._trigger("complete", null, { value: 100 });
        }
    },
    _constrain: function (value) {
        if (value > 100) {
            value = 100;
        }
        if (value < 0) {
            value = 0;
        }
        return value;
    },
    _destroy: function () {
        this.element
            .removeClass("test")
            .text("");
    }
});

在索引文件中，我渲染包：

@Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/jqueryui")
@Scripts.Render("~/bundles/lib")

在文件的头部（注意：我的小部件脚本文件位于lib包中）。然后，在渲染代码之后，我添加了一个脚本标记并添加了这个：

<script>
            $(function() {
                //OTHER CODE

                var test = $("<div></div>")
                    .appendTo("body")
                    .test();

                test.option( "value", 50 );

                alert(test.options.value);
            });

        </script>

此脚本标记中还有其他代码，因此我知道至少部分代码可以正常工作。现在，当我加载页面时，我收到一个错误（它指示我到代码的$ .widget（“custom.test”，...）部分）说“未捕获的TypeError：undefined不是函数” 。当我查看源代码时，我可以看到javascript文件包含在正确的顺序中。

有谁知道为什么会发生这种情况以及如何解决这个问题？

修改

我尝试从窗口小部件访问信息的方式存在语法问题。正确的代码是：

            var something = $(".test").colorize();
            something.colorize("option", "value", 100);
            var test = something.colorize("option", "value");
            alert(test);

            something.colorize("random");
            alert(something.colorize("option", "red"));

Answer 1

如果您要连接javascript文件，请确保它们以(jQuery);结尾，而不仅仅是(jQuery) - 请注意分号

如果捆绑的JS没有被缩小 - 未被捕获的类型错误引用的行号应该引导您进行此操作。

（99％的情况下，我看到这种情况并且开发人员正在组合文件 - 尽管并非总是如此）

Jquery小部件未定义

1 个答案: