为什么我的javascript DOM不起作用?

时间:2015-11-07 12:12:29

标签: javascript php jquery

这是我的整个页面。我不知道出了什么问题。它太令人沮丧,因为它太简单了。

如果我输入字段时我试图取出值,那么它什么都不给。即使我在AJAX之前发出警报也没有写出任何内容。我复制了一个输入dom得到我的,它是完全相同的。

出了什么问题?

和registration.php:

<?php
    if(isset($_POST["php_username"]) && isset($_POST["php_password"]) && isset($_POST["php_password2"]) && isset($_POST["php_email"])){
        $error = "";
        if(strlen($_POST["php_username"]) < 8){
            $error = $error."Username has to be at least 8 characters.<br>";
        }
        if(strlen($_POST["php_password"]) < 8){
            $error = $error."password has to be at least 8 characters.<br>";
        }
        if(strlen($_POST["php_username"]) > 16){
            $error = $error."Username can't be more than 16 characters.<br>";
        }
        if(strlen($_POST["php_password"]) < 16){
            $error = $error."Password can't be more than 16 characters.<br>";
        }
        if(strcmp($_POST["php_password"],$_POST["php_password2"])){
            $error = $error."Password confirmation falied.<br>";
        }
        echo($error);

    }else{
        echo('
            <div id="register-form">
                <form>
                    <h2 style="text-decoration: underline; margin-bottom: 10px;">Registration</h2><br><br>
                    Username:<br>
                    <input type="text" maxlength="16" id="username" value="asd" /><br>
                    Password:<br>
                    <input type="password" maxlength="16" id="password" /><br>
                    Confirm password:<br>
                    <input type="password" maxlength="16" id="password2" /><br>
                    E-mail address:<br>
                    <input type="email" id="email" /><br><br>
                    <input type="button" id="registration-submit" value="Signup"><br>
                    <div id="registration-response">                        
                    </div>
                </form>
            </div>
            <script>
                $("#registration-submit").click(function(){
                    var username = document.getElementById("username").value; 
                    var password = document.getElementById("password").value; 
                    var password2 = document.getElementById("password2").value; 
                    var email = document.getElementById("email").value; 

                    $.post("registration.php",{
                        "php_username": username,
                        "php_password": password,
                        "php_password2": password2,
                        "php_email": email
                    },
                    function(data, status){
                        $("#registration-response").html(data);
                        $("#registration-response").fadeIn(750);
                    });

                });
            </script>
        ');
    }
?>

1 个答案:

答案 0 :(得分:0)

将你的javascript放在echo语句之外,并将其包装在$(document).ready();

        <?php
            if(isset($_POST["php_username"]) && isset($_POST["php_password"]) && isset($_POST["php_password2"]) && isset($_POST["php_email"])){
                $error = "";
                if(strlen($_POST["php_username"]) < 8){
                    $error = $error."Username has to be at least 8 characters.<br>";
                }
                if(strlen($_POST["php_password"]) < 8){
                    $error = $error."password has to be at least 8 characters.<br>";
                }
                if(strlen($_POST["php_username"]) > 16){
                    $error = $error."Username can't be more than 16 characters.<br>";
                }
                if(strlen($_POST["php_password"]) < 16){
                    $error = $error."Password can't be more than 16 characters.<br>";
                }
                if(strcmp($_POST["php_password"],$_POST["php_password2"])){
                    $error = $error."Password confirmation falied.<br>";
                }
                echo($error);

            }else{
                echo('
                    <div id="register-form">
                        <form>
                            <h2 style="text-decoration: underline; margin-bottom: 10px;">Registration</h2><br><br>
                            Username:<br>
                            <input type="text" maxlength="16" id="username" value="asd" /><br>
                            Password:<br>
                            <input type="password" maxlength="16" id="password" /><br>
                            Confirm password:<br>
                            <input type="password" maxlength="16" id="password2" /><br>
                            E-mail address:<br>
                            <input type="email" id="email" /><br><br>
                            <input type="button" id="registration-submit" value="Signup"><br>
                            <div id="registration-response">                        
                            </div>
                        </form>
                    </div>');


    <script>

    $(document).ready(function(){
    $("#registration-submit").click(function(){
        var username = document.getElementById("username").value; 
        var password = document.getElementById("password").value; 
        var password2 = document.getElementById("password2").value; 
        var email = document.getElementById("email").value; 

        $.post("registration.php",{
            "php_username": username,
            "php_password": password,
            "php_password2": password2,
            "php_email": email
             },
         function(data, status){
             $("#registration-response").html(data);
             $("#registration-response").fadeIn(750);
             });

           });
       });                    

   </script>

            }
        ?>