Question

我的朋友给了我这张表格，他告诉我一份问卷表格，但我把它修改为注册，但没有工作。

HTML

这是我的表单，它将转到reg.php，但它不起作用，JavaScript只用于验证/发送消息。

<form  method="post" action="reg.php" id="theForm" class="simform form" ">
 <div class="simform-inner">
  <ol class="questions">
   <li>
    <span><label for="q1">What's your full name?</label></span>
     <input  name="Name" id="name" type="text" /> 
   </li>
    <li>
     <span><label for="q2">What's your email?</label></span>
       <input  name="Email" id="email" type="email"/> 
    </li>
    <li>
     <span><label for="q3">your new username</label></span>
      <input  name="Username" id="username" type="text"/>
     </li>
     <li>
      <span><label for="q3">your new password</label></span>
       <input  size="16" name="Password" id="password"type="password"/>
     </li>

 </ol><!-- /questions -->
            <button class="submit" value="submit" name="reg" type="submit">Continue</button>


    <div class="controls">
     <button class="next"></button>
    <div class="progress"></div>

     <span class="number">
      <span class="number-current"></span>
       <span class="number-total"></span>
     </span>
     <span class="error-message"></span>
      </div><!-- / controls -->
      </div><!-- /simform-inner -->
      <span class="final-message"></span>
 </form><!-- /simform -->

JavaScript

加载并显示我的留言

<script>  
  new stepsForm( theForm, {
    onSubmit : function( form ) {
      // hide form
      classie.addClass( theForm.querySelector( '.simform-inner' ), 'hide' );
      /*
      form.submit()
      or
      AJAX request (maybe show loading indicator while we don't have an answer..)
      */

      // let's just simulate something...
      var messageEl = theForm.querySelector( '.final-message' );
      messageEl.innerHTML = 'Welcome!.';
      classie.addClass( messageEl, 'show' );
    }
  } );
 </script>

PHP

<?
$reg = @$_POST['reg'];

//declaring variables to prevent errors
$Name = ""; //First Name
$Email= ""; //Email
$Username= ""; //Username
$Password = ""; //Password
$em2 = ""; //Email 2
$d = ""; // Sign up Date
$u_check = ""; // Check if username exists
//registration form
$Name = strip_tags(@$_POST['Name']);
$Username = strip_tags(@$_POST['Username']);
$Email = strip_tags(@$_POST['Email']);
$Password = strip_tags(@$_POST['Password']);
$d = date("Y-m-d"); // Year - Month - Day


if ($reg) {
    if ($Email==$Email) {
        // Check if user already exists
        $u_check = mysql_query("SELECT username FROM users WHERE username='$Username'");
        // Count the amount of rows where username = $un
        $check = mysql_num_rows($u_check);
        //Check whether Email already exists in the database
        $e_check = mysql_query("SELECT email FROM users WHERE email='$Email'");
        //Count the number of rows returned
        $email_check = mysql_num_rows($e_check);
            if ($check == 0) {
                  if ($email_check == 0) {
                    //check all of the fields have been filed in
                    if ($Name&&$Username&&$Email&&$Password) {
                        // check that passwords match
                        if ($Password) {
                            // check the maximum length of username/first name/last name does not exceed 25 characters
                            if (strlen($Username)>25||strlen($Name)>25) {
                                echo "The maximum limit for username/first name/last name is 25 characters!";
                            }else{
                                // check the maximum length of password does not exceed 25 characters and is not less than 5 characters
                                if (strlen($Password)>30||strlen($Password)<5) {
                                    echo "Your password must be between 5 and 30 characters long!";
                                }else{
                                    //encrypt password and password 2 using md5 before sending to database
                                    $Password = md5($Password);
                                    $query = mysql_query("INSERT INTO users VALUES ('','$Username','$Name',$Email','$Password','$d','0','Write something about yourself.','','','no')");
                                    die("<h2>Welcome!/h2>Login to your account to get started ...");
                                }
                            }
                        }else{
                         echo "Sorry, but it looks like someone has already used that email!";
                        }
                    }else{
                        echo "Username already taken ...";
                    }

                }
            }
    }
}

?>

Stepform.js

;( function( window ) {

    'use strict';

    var transEndEventNames = {
            'WebkitTransition': 'webkitTransitionEnd',
            'MozTransition': 'transitionend',
            'OTransition': 'oTransitionEnd',
            'msTransition': 'MSTransitionEnd',
            'transition': 'transitionend'
        },
        transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
        support = { transitions : Modernizr.csstransitions };

    function extend( a, b ) {
        for( var key in b ) {
            if( b.hasOwnProperty( key ) ) {
                a[key] = b[key];
            }
        }
        return a;
    }

    function stepsForm( el, options ) {
        this.el = el;
        this.options = extend( {}, this.options );
        extend( this.options, options );
        this._init();
    }

    // generates a unique id
    function randomID() {
        var id = Math.random().toString(36).substr(2, 9);
        if (document.getElementById(id)) {
            return randomID();
        }
        return id;
    }

    stepsForm.prototype.options = {
        onSubmit : function() { return false; }
    };

    stepsForm.prototype._init = function() {
        // current question
        this.current = 0;

        // questions
        this.questions = [].slice.call( this.el.querySelectorAll( 'ol.questions > li' ) );
        // total questions
        this.questionsCount = this.questions.length;
        // show first question
        classie.addClass( this.questions[0], 'current' );

        // next question control
        this.ctrlNext = this.el.querySelector( 'button.next' );
        this.ctrlNext.setAttribute( 'aria-label', 'Next' );

        // progress bar
        this.progress = this.el.querySelector( 'div.progress' );
        // set progressbar attributes
        this.progress.setAttribute( 'role', 'progressbar' );
        this.progress.setAttribute( 'aria-readonly', 'true' );
        this.progress.setAttribute( 'aria-valuemin', '0' );
        this.progress.setAttribute( 'aria-valuemax', '100' );
        this.progress.setAttribute( 'aria-valuenow', '0' );

        // question number status
        this.questionStatus = this.el.querySelector( 'span.number' );
        // give the questions status an id
        this.questionStatus.id = this.questionStatus.id || randomID();
        // associate "x / y" with the input via aria-describedby
        for (var i = this.questions.length - 1; i >= 0; i--) {
            var formElement = this.questions[i].querySelector( 'input, textarea, select' );
            formElement.setAttribute( 'aria-describedby', this.questionStatus.id );
        };
        // current question placeholder
        this.currentNum = this.questionStatus.querySelector( 'span.number-current' );
        this.currentNum.innerHTML = Number( this.current + 1 );
        // total questions placeholder
        this.totalQuestionNum = this.questionStatus.querySelector( 'span.number-total' );
        this.totalQuestionNum.innerHTML = this.questionsCount;

        // error message
        this.error = this.el.querySelector( 'span.error-message' );

        // checks for HTML5 Form Validation support
        // a cleaner solution might be to add form validation to the custom Modernizr script
        this.supportsHTML5Forms = typeof document.createElement("input").checkValidity === 'function';

        // init events
        this._initEvents();
    };

    stepsForm.prototype._initEvents = function() {
        var self = this,
            // first input
            firstElInput = this.questions[ this.current ].querySelector( 'input, textarea, select' ),
            // focus
            onFocusStartFn = function() {
                firstElInput.removeEventListener( 'focus', onFocusStartFn );
                classie.addClass( self.ctrlNext, 'show' );
            };

        // show the next question control first time the input gets focused
        firstElInput.addEventListener( 'focus', onFocusStartFn );

        // show next question
        this.ctrlNext.addEventListener( 'click', function( ev ) {
            ev.preventDefault();
            self._nextQuestion();
        } );

        // pressing enter will jump to next question
        document.addEventListener( 'keydown', function( ev ) {
            var keyCode = ev.keyCode || ev.which;
            // enter
            if( keyCode === 13 ) {
                ev.preventDefault();
                self._nextQuestion();
            }
        } );
    };

    stepsForm.prototype._nextQuestion = function() {
        if( !this._validate() ) {
            return false;
        }

        // checks HTML5 validation
        if ( this.supportsHTML5Forms ) {
            var input = this.questions[ this.current ].querySelector( 'input, textarea, select' );
            // clear any previous error messages
            input.setCustomValidity( '' );

            // checks input against the validation constraint
            if ( !input.checkValidity() ) {
                // Optionally, set a custom HTML5 valiation message
                // comment or remove this line to use the browser default message
                input.setCustomValidity( 'Whoops, that\'s not an email address!' );
                // display the HTML5 error message
                this._showError( input.validationMessage );
                // prevent the question from changing
                return false;
            }
        }

        // check if form is filled
        if( this.current === this.questionsCount - 1 ) {
            this.isFilled = true;
        }

        // clear any previous error messages
        this._clearError();

        // current question
        var currentQuestion = this.questions[ this.current ];

        // increment current question iterator
        ++this.current;

        // update progress bar
        this._progress();

        if( !this.isFilled ) {
            // change the current question number/status
            this._updateQuestionNumber();

            // add class "show-next" to form element (start animations)
            classie.addClass( this.el, 'show-next' );

            // remove class "current" from current question and add it to the next one
            // current question
            var nextQuestion = this.questions[ this.current ];
            classie.removeClass( currentQuestion, 'current' );
            classie.addClass( nextQuestion, 'current' );
        }

        // after animation ends, remove class "show-next" from form element and change current question placeholder
        var self = this,
            onEndTransitionFn = function( ev ) {
                if( support.transitions ) {
                    this.removeEventListener( transEndEventName, onEndTransitionFn );
                }
                if( self.isFilled ) {
                    self._submit();
                }
                else {
                    classie.removeClass( self.el, 'show-next' );
                    self.currentNum.innerHTML = self.nextQuestionNum.innerHTML;
                    self.questionStatus.removeChild( self.nextQuestionNum );
                    // force the focus on the next input
                    nextQuestion.querySelector( 'input, textarea, select' ).focus();
                }
            };

        if( support.transitions ) {
            this.progress.addEventListener( transEndEventName, onEndTransitionFn );
        }
        else {
            onEndTransitionFn();
        }
    }

    // updates the progress bar by setting its width
    stepsForm.prototype._progress = function() {
        var currentProgress = this.current * ( 100 / this.questionsCount );
        this.progress.style.width = currentProgress + '%';
        // update the progressbar's aria-valuenow attribute
        this.progress.setAttribute('aria-valuenow', currentProgress);
    }

    // changes the current question number
    stepsForm.prototype._updateQuestionNumber = function() {
        // first, create next question number placeholder
        this.nextQuestionNum = document.createElement( 'span' );
        this.nextQuestionNum.className = 'number-next';
        this.nextQuestionNum.innerHTML = Number( this.current + 1 );
        // insert it in the DOM
        this.questionStatus.appendChild( this.nextQuestionNum );
    }

    // submits the form
    stepsForm.prototype._submit = function() {
        this.options.onSubmit( this.el );
    }

    // TODO (next version..)
    // the validation function
    stepsForm.prototype._validate = function() {
        // current question´s input
        var input = this.questions[ this.current ].querySelector( 'input, textarea, select' ).value;
        if( input === '' ) {
            this._showError( 'EMPTYSTR' );
            return false;
        }

        return true;
    }

    // TODO (next version..)
    stepsForm.prototype._showError = function( err ) {
        var message = '';
        switch( err ) {
            case 'EMPTYSTR' :
                message = 'Please fill the field before continuing';
                break;
            case 'INVALIDEMAIL' :
                message = 'Please fill a valid email address';
                break;
            // ...
            default :
                message = err;
        };
        this.error.innerHTML = message;
        classie.addClass( this.error, 'show' );
    }

    // clears/hides the current error message
    stepsForm.prototype._clearError = function() {
        classie.removeClass( this.error, 'show' );
    }

    // add to global namespace
    window.stepsForm = stepsForm;

})( window );

Answer 1

你遗漏了很多大括号。

if ($reg) {
    if ($em==$em2) {
        // Check if user already exists
        $u_check = mysql_query("SELECT username FROM users WHERE username='$Username'");
        // Count the amount of rows where username = $un
        $check = mysql_num_rows($u_check);
        //Check whether Email already exists in the database
        $e_check = mysql_query("SELECT email FROM users WHERE email='$Email'");
        //Count the number of rows returned
        $email_check = mysql_num_rows($e_check);
            if ($check == 0) {
                  if ($email_check == 0) {
                    //check all of the fields have been filed in
                    if ($Name&&$Username&&$Email&&$Password) {
                        // check that passwords match
                        if ($Password) {
                            // check the maximum length of username/first name/last name does not exceed 25 characters
                            if (strlen($Username)>25||strlen($Name)>25) {
                                echo "The maximum limit for username/first name/last name is 25 characters!";
                            }else{
                                // check the maximum length of password does not exceed 25 characters and is not less than 5 characters
                                if (strlen($Password)>30||strlen($Password)<5) {
                                    echo "Your password must be between 5 and 30 characters long!";
                                }else{
                                    //encrypt password and password 2 using md5 before sending to database
                                    $Password = md5($Password);
                                    $query = mysql_query("INSERT INTO users VALUES ('','$Username','$Name',$Email','$Password','$d','0','Write something about yourself.','','','no')");
                                    die("<h2>Welcome!/h2>Login to your account to get started ...");
                                }
                            }
                        }else{
                         echo "Sorry, but it looks like someone has already used that email!";
                        }
                    }else{
                        echo "Username already taken ...";
                    }

                }
            }
    }
}

我的JavaScript / PHP表单不起作用，并且没有在我的phpMyAdmin中显示

1 个答案: