HTML5とJSでワンタップゲームを作る

tan3 126views 更新:2016年2月24日

初めまして。単三と申します。よろしくお願いいたします。

youtubeのチュートリアルリンクテキストを参考にワンタップゲームを作っています。 ログイン画面を作るところでつまずいています。 「Register/login」を押しても何も表示されません・・・

アプリを作るのは初めてなので右も左もわかりません。 ご教授お願いいたします。

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
    <link rel="stylesheet" href="components/loader.css">
    <link rel="stylesheet" href="css/style.css">
    <script src="components/loader.js"></script>
    <script src="js/ncmb-2.0.0.min.js"></script>
    <script>

        $(function(){
            //mBaaSの初期化
            var application_key = "e8b3ac5d3414dd680a8255826bf5befd9777f0332ebc20d8a763fec086433139";
            var client_key = "f9ce2c9cde82a4d8044959e4ac47088bcd69e16d2e9fc4cfca776817426b6d6f";
            var ncmb = new NCMB(application_key, client_key);
            //ログイン・新規処理
            $("form").on("submit",function() {
                var username = $("#username").val();
                var password = $("#password").val();

                //ログイン
                ncmb.User,login(username, password)
                .then(function() {
                    //ログイン成功
                    alert("ログイン成功");
                })
                .catch(function() {
                    //ログイン失敗
                     var user = new ncmb.User({
                         userName: username,
                         password: password
                     });
                     //新規登録
                     user.signUpByAccount()
                     .then(function() {
                         //ログイン
                         ncmb.User,login(username, password)
                .then(funtion() {
                    //ログイン成功
                    alert("新規登録&ログイン成功");            
                 })
                });
                return false;
            });    
        });

    </script>
    <style>
        body{
            background-color: #BBDEFB;
            padding-top: 20px;
            font-family: Verdana, sans-serif;
        }
        form{
            padding: 30px auto;
            text-align: center;
        }
        input{
            border-radius:  5px;
            padding: 7px;
            margin-bottom: 10px;
            width: 200px;
            font-size: 20px;
        }
    </style>
</head>
<body>

    <form>
    <input type="text" id="username" placeholder="User name" />
    <input type="password" id="pasword" placeholder="Password" />
    <input type="submit" value="Register/Login"  />
</form>
</body>
</html>

コメント

  1. YY3ai2ui24 のコメント (2016年3月2日)

    24行目の
    ncmb.User,login

    ncmb.User.login
    にすると動くかもしれません。

    ブラウザのデベロッパーツールのコンソール機能などを活用するとエラーの内容が表示されるので、見てみると良いです。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません