4

私の JS スキルを判断しないでください。私はまったくの初心者です。=))

だから私はユーザーを登録する機能を持っていますが、「create_sample_user」ボタンを作成してテキストフィールドにデータを入力したいと思います。このようにして、人々は名前や電子メールなどを入力しなくても、Web サイトをすばやく確認できます...

ここに画像の説明を入力

しかし、問題は次のとおりです。ユーザー名と他のすべてのフィールドを自分で入力すると、登録ボタンが正常に機能します。しかし、「create_sample_user」ボタンを入力しても機能しません（テキストフィールドの値が「見えない」だけだと思います）。

function create_sample_user() {
    var button = $("#create-sample-user");
    button.click(function() {
        var ranNum = 1 + Math.floor(Math.random() * 100);
        var uname = 'Sample_'+ranNum;
        $("#id_username").val(uname);
        $("#id_email").val(uname+'@'+uname+'.com');
        $("#id_password").val(uname);
        $("#id_password2").val(uname);
    });
}

function register_user() {
    $("#register-user").click(function() {
        $.ajax({
            url: "/registration/register_user/",
            type: "POST",
            dataType: "text",
            data: {
                username : $("#id_username").val(),
                email : $("#id_email").val(),
                password : $("#id_password").val(),
                password2 : $("#id_password2").val(),
            },
            success: function(data) {
                parsed_data = $.parseJSON(data);
                if (data) {
                    alert("User was created");
                    window.location = parsed_data.link;
                }
                else {
                    alert("Error");
                }

            }
        });
    });
}

答え：

次のコード行の 1 文字が原因で、すべてが機能しませんでした。

`var uname = 'Sample_'+ranNum;`

何らかの理由_で文字が問題であり、AJAX はそれを取りたがりませんでした。言い換えると：

var uname = 'Sample'+ranNum;

この行はトリックを行います:=)

4

3 に答える 3

2

さて、あなたのcreate_sample_user()メソッドをこれに置き換えてください：

$(document).ready(function() {
    var button = $("#create-sample-user");
    button.click(function() {
        var ranNum = 1 + Math.floor(Math.random() * 100);
        var uname = 'Sample_'+ranNum;
        $("#id_username").val(uname);
        $("#id_email").val(uname+'@'+uname+'.com');
        $("#id_password").val(uname);
        $("#id_password2").val(uname);
    });
}​);​

また、function register_user()関数ラッパーを削除してみてください。

これでうまくいくはずです。成功アラート ボックスもポップアップするはずです (jsFiddle に AJAX エコーを使用するように AJAX URL を変更しました): http://jsfiddle.net/MQ6Cq/4/

更新 (コードを投稿したので、見つけたバグでこれを更新します):

  • 現在2 つの$(document).ready()通話があります - 最初の通話を削除してください (これは編集されました)
  • function register_user() {登録ユーザークリックハンドラの周りから行と閉じ中括弧を削除する必要があります

テストに役立つ場合に備えて、以前のフィドルを少し更新し、リクエストタイプを「GET」に変更しました。ブラウザーのコンソール (F12) を開き、右クリックして XMLHttpRequests のロギングをオンにします。それを実行すると、AJAX がデータを正常に送信していることがわかります。あなたの他のもののどこが悪いのかわかりませんが、それをテストできるサーバーがありません。また、各提案を試した後（またはあなたがそれらを再試行します）。これが問題の解決に役立つことを願っています。

幸運を！:)

于 2012-09-10T18:26:40.583 に答える
1

コードは機能するはずです。これがjsfiddle（その簡略版）です

コンソールを見ると、データが適切にフォーマットされていることがわかります。

コードに表示されるのは、create_sample_user（）が呼び出されないため、クリックイベントがボタンに適用されないことだけです。しかし、私はあなたがそれを質問に入れるのを省略したと思います

create_sample_user();
$('#register-user').click(register_user);

function create_sample_user() {
    var button = $("#create-sample-user");
    button.click(function() {
        var ranNum = 1 + Math.floor(Math.random() * 100);
        var uname = $("#id_username").val('Sample_'+ranNum);
        $("#id_email").val(uname.val()+'@'+uname.val()+'.com');
        $("#id_password").val(uname.val());
        $("#id_password2").val(uname.val());
    });
}



function register_user() {
    data = {
                username : $("#id_username").val(),
                email : $("#id_email").val(),
                password : $("#id_password").val(),
                password2 : $("#id_password2").val(),
            }

    console.log(data);
}
于 2012-09-10T18:26:08.840 に答える
0 
$("#create-sample-user").click(create_sample_user);

$('#register-user').click(register_user);

function create_sample_user() {

    var ranNum = 1 + Math.floor(Math.random() * 100);
    var uname = $("#id_username").val('Sample_' + ranNum);
    $("#id_email").val(uname.val() + '@' + uname.val() + '.com');
    $("#id_password").val(uname.val());
    $("#id_password2").val(uname.val());

}

function register_user() {
    data = {
        username: $("#id_username").val(),
        email: $("#id_email").val(),
        password: $("#id_password").val(),
        password2: $("#id_password2").val(),
    }

    console.log(data);
}
于 2012-09-10T18:32:40.943 に答える