0

jQuery を使用した最初のアプリが登場しました。両方のダイアログ ボックスがビルドされ、正常に実行されました。[ファイル] メニューの [ログイン] をクリックすると、ログイン ボックスが表示されましたが、できませんでした。 [開く] をクリックすると、[開く] ボックスが表示されます。

両方のダイアログの jQuery コードは次のとおりです。

$("#login-form").dialog({
    autoOpen: false,
    height: 350,
    width: 350,
    modal: true,
    buttons: {
        "Log In": function () {
            var bValid = true;
            allFields.removeClass("ui-state-error");

            bValid = bValid && checkLength(username, "username", 3, 16);
            bValid = bValid && checkLength(password, "password", 5, 16);

            bValid = bValid && checkRegexp(username, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter.");
            bValid = bValid && checkRegexp(password, /^([0-9a-zA-Z])+$/, "Password may consist of : a-z 0-9");

            if (bValid) {
                if (username.val() == "admin" && password.val() == "password") {
                    $("#users tbody").append("<tr>" + "<td>" + username.val() + "</td>" + "<td>" + password.val() + "</td>" + "</tr>");
                    $(this).dialog("close");
                } else {
                    alert("Invalid Username/Password Combo");
                }
            }
        },
        Cancel: function () {
            $(this).dialog("close");
        }
    },
    close: function () {
        allFields.val("").removeClass("ui-state-error");
    }
});

$("#dateturn-form").dialog({
    autoOpen: false,
    height: 550,
    width: 350,
    modal: true,
    buttons: {
        "Accept": function () {
            $("#content-left").append("<p>Date: " + dateinput.val() + " turn: " + turnvalue + "</p>");
            $(this).dialog("close");


        },
        Cancel: function () {
            $(this).dialog("close");
        }
    }
});

$("#login")
    .click(function () {
    $("#login-form").dialog("open");
});

$("#open")
    .click(function () {
    $("dateturn-form").dialog("open");
});

プロジェクトへの jsFiddle リンクは次のとおり です。

4

2 に答える 2