2014-01-28 2 views
-1

javascript와 ajax를 사용하여 restrict (elem) 함수와 checkusername() 함수가 작동하는 것처럼 보이면 등록 양식의 유효성을 검사하고, ajax는 checkusername 변수를 다음으로 전달합니다. PHP와 사용자 이름이 존재하고 사용자 이름을 촬영하거나 사용할 수 있지만 다른 필드의 유효성을 검사하지 얻을 말을 나에게 메시지를 표시하는 경우이 확인이 유효성 검사 클라이언트 측 B4 여기왜 일부 자바 스크립트 함수 만 작동합니까?

function restrict(elem) { 
    var tf = _(elem); 
    var rx = new RegExp; 
    if (elem === "email") { 
     rx = /[' "]/gi; 
    } else if (elem === "username") { 
     rx = /[^a-z0-9]/gi; 
    } else if (elem === "mobileNumber") { 
     rx = /[0-9]/g; 
    } 
    tf.value = tf.value.replace(rx, ""); 
} 

function emptyElement(x) { 
    _(x).innerHTML = ""; 
} 

function checkusername() { 
    var u = _("username").value; 
    if (u !== "") { 
     _("unamestatus").innerHTML = 'checking ...'; 
     var ajax = ajaxObj("POST", "signup.php"); 
     ajax.onreadystatechange = function() { 
      if (ajaxReturn(ajax) === true) { 
       _("unamestatus").innerHTML = ajax.responseText; 
      } 
     }; 
     ajax.send("usernamecheck=" + u); 
    } 
} 

function signup() { 
    var u = _("username").value; 
    var e = _("email").value; 
    var m = _("mobileNumber").value; 
    var p1 = _("pass1").value; 
    var p2 = _("pass2").value; 
    var ci = _("city").value; 
    var pc = _("postcode").value; 
    var c = _("country").value; 
    var d = _("dateOfBirth").value; 
    var g = _("gender").value; 
    var status = _("status"); 
    if (u === "" || e === "" || p1 === "" || p2 === "" || c === "" || g === "" || m === "" || ci === "" || pc === "" || d === "") { 
     status.innerHTML = "Fill out required fields"; 
    } else if (p1 !== p2) { 
     status.innerHTML = "Your password fields do not match"; 
    } else if (m !== 11 && !IsNumeric(m)) { 
     status.innerHTML = "Please enter valid mobile number"; 
    } else if (d === "dd/mm/yyyy") { 
     status.innerHTML = "Please enter your date of birth"; 

    } else { 
     //ajax to send form data to php 
     //hides sign button 
     _("signupbtn").style.display = "none"; 
     status.innerHTML = 'please wait ...'; 
     //wait until php verifies data 
     var ajax = ajaxObj("POST", "signup.php"); 
     ajax.onreadystatechange = function() { 
      if (ajaxReturn(ajax) === true) { 
       //if sign not succesful unhide button 
       if (ajax.responseText !== "signup_success") { 
        status.innerHTML = ajax.responseText; 
        _("signupbtn").style.display = "block"; 
       } else { 
        window.scrollTo(0, 0); 
        _("signupform").innerHTML = "OK " + u + ", check your email inbox and junk mail box at <u>" + e + "</u> in a moment to complete the sign up process by activating your account. You will not be able to do anything on the site until you successfully activate your account."; 
       } 
      } 
     }; 
     ajax.send("u=" + u + "&e=" + e + "&p=" + p1 + "&c=" + c + "&g=" + g + "&ci" + ci + "&m" + m + "&pc" + pc + "&d" + d); 
    } 
} 

및 PHP로가는 자바 스크립트 내 자바 스크립트

입니다 내 양식은

입니다. 10
<form name="signupform" id="signupform" onsubmit="return false;"> 
    <div>Username: </div> 
    <input id="username" type="text" onblur="checkusername()" onkeyup="restrict('username')" maxlength="16"> 
    <span id="unamestatus"></span> 
    <div>Email Address:</div> 
    <input id="email" type="email" onfocus="emptyElement('status')" onkeyup="restrict('email')" maxlength="88"> 
    <div>Create Password:</div> 
    <input id="pass1" type="password" onfocus="emptyElement('status')" maxlength="16"> 
    <div>Confirm Password:</div> 
    <input id="pass2" type="password" onfocus="emptyElement('status')" maxlength="16"> 
    <div>First name:</div> 
    <input id="firstName" type="text" /><br /> 
    <div>Last name:</div> 
    <input id="lastName" type="text" /><br /> 
    <div>Mobile number*:</div> 
    <input name="mobileNumber" onfocus="emptyElement('status')" onkeyup="restrict('mobileNumber')" maxlength="16"> 
    <div>Gender:</div> 
    <select id="gender" onfocus="emptyElement('status')"> 
     <option value=""></option> 
     <option value="Male">Male</option> 
     <option value="Female">Female</option> 
    </select> 
    <div>Country:</div> 
    <select id="country" onfocus="emptyElement('status')"> 
     <?php include_once("country_list.php"); ?> 
    </select> 
    <div>City:</div> 
    <input id="city" onfocus="emptyElement('status')"> 
    <div>Postcode:</div> 
    <input id="postcode" onfocus="emptyElement('status')"> 
    <div>Relationship Status*:</div> 
    <select id="relationshipStatus" > 
     <option value=""></option> 
     <option value="Single">Single</option> 
     <option value="Taken">Taken</option>    
       </select> 
    <div>Date of Birth*:</div> 
    <input id="dateOfBirth" type="date" onfocus="emptyElement('status')"> 
    <button id="signupbtn" onclick="signup()">Create Account</button> 
    <span id="status"></span> 
    </form> 
+0

감사합니다. –

+0

[사람들이 읽을 수 있도록 게시하기 전에 코드를 정리하는 것이 좋습니다.] (http://jsbeautifier.org) – Pointy

+0

지저분한 코드에 대해 유감스럽게 생각합니다. signup() 함수는 사용자가 시도는 양식을 제출하고 signup() 함수에 언급 된 필드가 비어 있거나 pass1이 pass2와 일치하는지 확인합니다. – JWayne93

답변

1

유효성 검사 정규식 당신이 원하는 일을하지 않습니다

function restrict(elem) { 
    var tf = _(elem); 
    var rx = new RegExp; 
    if (elem === "email") { 
     rx = /[' "]/gi; 
    } else if (elem === "username") { 
     rx = /[^a-z0-9]/gi; 
    } else if (elem === "mobileNumber") { 
     rx = /[0-9]/g; 
    } 
    tf.value = tf.value.replace(rx, ""); 
} 

귀하의 표현이 설정되어있는 필드 값의 임의의 한 문자는 문자 범위를 일치하는 경우가 유효성 검사를 통과 것이다 있도록. 전체 문자열이 다음과 같은 특정 범위의 문자로 구성되어 있다고 규정 할 수 있습니다.

rx = /^[a-z0-9]*$/; 
+0

배열 뒤에/g를 넣으면 * $는 무엇을 의미한다고 생각합니까? 현장의 모든 인물에 대항해서? – JWayne93

+0

@ JWayne93 아니요, "g"플래그가하는 것과 다릅니다. '^'와'$'는 문자열의 시작과 끝을 일치시킵니다. "g"플래그는 대개 대체 할 때 사용합니다. – Pointy

+0

오클라호마 괜찮습니다. 대체 예제를 살펴 봤는데, 자바 스크립트에서 signup() 함수가 실행되지 않는 이유를 아직 모릅니다. 단서가 있습니까? – JWayne93

관련 문제