Javascript jQuery模块中未触发事件默认值

我正试图编写一个jQuery脚本来存储RESTAPI服务的身份验证令牌。我有一个工作代码块，但决定模块化，使应用程序更具可伸缩性。现在，默认部分似乎不再工作了

            <form action="/" id="authorize">
                    <label for="username">Username:</label><br />
                    <input type="text" id="username" required /><br />
                    <label for="password">Password:</label><br />
                    <input type="password" id="password" required /><br />
                    <input type="submit" value="Authorize" /><span id="isValid" class="checkContainer">&nbsp;</span>
            </form><hr />
            <label for="serviceType" class="fieldDisabled">Method: </label>
            <select id="serviceType" disabled>
                    <option></option>
                    <option value="option1">Option 1</option>
                    <option value="option2">Option 2</option>
            </select>

---

我已经为此辛劳了大约一天，似乎找不到失败的地方。提交表单时，它将重定向到服务器的根目录，而不是按预期执行脚本。

您的from操作将指向目录的根目录“\”。相反，将它指向包含您要触发的代码的文件。

只是一些打字错误使代码停止运行。提交是默认行为，因为您的代码未能完成

使用调试器在运行时查看错误（了解并喜爱Chrome中的F12调试工具等！）：

1） 下面一行中的变量（json而不是数据）错误，因此出现错误：

bindUIActions: function () {
    s.form.submit(function (event) {
        event.preventDefault();
        data = Authorize.buildJSON(s.username.val(), s.password.val());
        Authorize.getToken(data);            // <<<<<<<<<<<<<<<<<<<<<<<
    });

---

如果检查代码，您将看到它应该劫持

submit

事件。永远不应该使用“\”（它指向“reacted”）），而实际的问题是代码有运行时错误，并且没有实际到达

evt.preventDefault（）

，因此表单仍在提交：）

            var s;
            var Authorize = {
                    token: null,
                    settings: {
                            username: $("#username"),
                            password: $("#password"),
                            form: $("#authorize"),
                            validationIcon: $("#isValid"),
                            selector: $("#serviceType"),
                            selectorLabel: $("label[for='serviceType']"),
                            serviceSelector: $(".methodFieldDisabled"),
                            url: "redacted"
                    },
                    init: function() {
                            s = Authorize.settings;
                            this.bindUIActions();
                    },
                    bindUIActions: function() {
                            s.form.submit(function(event) {
                                    event.preventDefault();
                                    data = Authorize.buildJSON(s.username.val(), s.password.val());
                                    Authorize.getToken(json);
                            });
                    },
                    buildJSON: function(username, password) {
                            var data = {};
                            data['grant_type'] = password;
                            data['username'] = username;
                            data['password'] = password;
                            return data;
                    },
                    getToken: function(data) {
                            $.ajax({
                                    type: "POST",
                                    url: s.url,
                                    data: data,
                                    success: function(json) {
                                        Authorize.success(json);
                                    },
                                    error: function(json) {
                                        Authorize.error(json);
                                    }
                            });
                    },
                    success: function(json) {
                            Authorize.token = json.accessToken;
                            Authorize.revealServiceSelector();
                    },
                    error: function(json) {
                            Authorize.hideServiceSelector();
                    },
                    revealServiceSelector: function() {
                            s.serviceSelector.hide();
                            if(s.validationIcon.hasClass("invalid")) {
                                    s.validationIcon.removeClass("invalid");
                            }
                            selectorLabel.removeClass("fieldDisabled");
                            selector.prop("disabled", false);
                            s.validationIcon.addClass("valid");
                    },
                    hideServiceSelector: function() {
                            s.serviceSelector.hide();
                            if(s.validationIcon.hasClass("valid")) {
                                    s.validationIcon.removeClass("valid");
                            }
                            selectorLabel.addClass("fieldDisabled");
                            selector.prop("disabled", "disabled");
                            s.validationIcon.addClass("invalid");
                    }
            };

bindUIActions: function () {
    s.form.submit(function (event) {
        event.preventDefault();
        data = Authorize.buildJSON(s.username.val(), s.password.val());
        Authorize.getToken(data);            // <<<<<<<<<<<<<<<<<<<<<<<
    });

revealServiceSelector: function () {
    s.serviceSelector.hide();
    if (s.validationIcon.hasClass("invalid")) {
        s.validationIcon.removeClass("invalid");
    }
    s.selectorLabel.removeClass("fieldDisabled");
    s.selector.prop("disabled", false);
    s.validationIcon.addClass("valid");
},
hideServiceSelector: function () {
    s.serviceSelector.hide();
    if (s.validationIcon.hasClass("valid")) {
        s.validationIcon.removeClass("valid");
    }
    s.selectorLabel.addClass("fieldDisabled");
    s.selector.prop("disabled", "disabled");
    s.validationIcon.addClass("invalid");
}