>웹 프론트엔드 >JS 튜토리얼 >Ajax를 사용한 비동기 요청 확인

Ajax를 사용한 비동기 요청 확인

巴扎黑
巴扎黑원래의
2017-07-03 10:34:271556검색

시나리오 설명:

모두가 로그인 프로세스에 익숙하지만 등록하려면 사용자 ID를 반복할 수 없는지 확인해야 합니다. 이 사용자 ID 감지 작업은 Ajax를 통해 완료됩니다.

테이블 구조:


<html>
<head><title>异步验证</title></head>
<body>
<script language="JavaScript">
	var xmlHttp;
	var flag;
	function createXMLHttp(){
		if (window.XMLHttpRequest){						// 创建XMLHttpRequest核心对象
			xmlHttp = new XMLHttpRequest()					// 使用FireFox内核
		}else {
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");	// 使用IE内核的浏览器
		}
	}

	function checkUserid(userid){		// 显示信息
		createXMLHttp();	//
		// 设置请求,通过地址重写方式将userid传递到JSP中
		
		xmlHttp.open("POST","CheckServlet?userid="+userid);
		// 设置完请求后调用处理回调函数
		xmlHttp.onreadystatechange = checkUseridCallback;
		xmlHttp.send(null);	// 发送请求,不设置参数
		//document.getElementById("msg").innerHTML = "正在验证……";
				//alert("*******");

	}

	function checkUseridCallback(){	// 回调函数
		if (xmlHttp.readyState == 4){			// 数据返回完毕
			if (xmlHttp.status == 200){			// HTTP操作正常
				alert("*****8");
				var text = xmlHttp.responseText;// 接收返回内容
				if (text == "true"){
					flag = false;				// 无法提交表单
					document.getElementById("msg").innerHTML = "用户名ID重复,无法使用";
				}else {
					flag = true;				// 可以提交表单
					document.getElementById("msg").innerHTML = "恭喜!此用户ID可以注册";
				}
			}
		}
	}

	function checkForm(){	// 对表单判断能否进行提交操作
		return flag;
	}
</script>
	<form action="xxx.jsp" method="post" onsubmit="return checkForm()">
		用户ID:<input type="text" name="userid" onblur="checkUserid(this.value)"><span id="msg"></span><br>
		姓  名:<input type="text" name="name"><br>
		密  码:<input type="password" name="password"><br>
		<input type="submit" value="注册">
		<input type="reset" value="重置">
	</form>
</body>
<html>

Servlet.java (물론 액션으로 구성할 수도 있습니다. 스스로가 아니라 반드시 Servlet.java) 서블릿) 보기 plaincopy




웹 페이지 오류 세부 정보



메시지: 'userid'가 정의되지 않았습니다


  1. 줄: 18

    문자 )
  2. →function checkUserid(userid){ // 정보 표시

  3. 선언된 매개변수 없음


입력할 수 없음

if (xmlHt tp.status == 20 0){                                                                           // HTTP 작업이 정상입니다

alert("*****3");

ExplanationHTTP작업이 정상이 아닌데 HTTP상태 코드를 어떻게 반환하나요?

디버깅 프로세스:



[html] 보기 plaincopy


  1. if (xmlHttp.readyState == 4){ // 데이터 반환 완료

  2.               //alert("*****2" );

  3. Alert(xmlHttp);

  4. alert(xmlHttp.readyState);

                   Alert(xmlHttp.status);
  5. 경고("*****3")
  6. Pxmlhttp.readyState == 4


    데이터가 완전하지만 서버가 지정된 항목을 찾을 수 없습니다. 리소스(), 문서가 존재하지 않습니다! 그리고 Servlet디버깅이 전혀 입력되지 않는 이유는 무엇입니까? ? ?
    MLDN 포럼 교사 Li Qi가 답변했습니다. 즉, AJAX

    제출 경로에 해당하는 리소스가 존재하지 않는다는 의미입니다.

    당신의 Servlet은 컴파일된

    class 파일을 프로젝트의 WEB-INF/classes 디렉토리에 넣어야 하며 추가되지 않은 경우 해당 패키지에 넣어야 합니다.

    이 문제가 다시 발생합니다.

    Servlet.java파일을

    WEB-INF/classes

    폴더에 넣을 필요는 없습니다! ! ! ! ! ! ! ​​​​

    4f01b97d64aea37f699ead4eb7bd2bbd

    어디에 배치되나요?

    Other

    컴파일 오류:

    java.lang.ClassNotFoundException: DBDRIVERClass.forName("DBDRIVER"); // 드라이버를 로드하지 마세요.

    ""

    표시 효과:


    🎜🎜/* http://blog.csdn.net/zhangze2/article/에서 재인쇄됨 세부정보/79594 93 */ 🎜




    [html] 보기 plaincopy


    1. 웹 페이지 오류 세부 정보

    2. 메시지: 'userid'가 정의되지 않았습니다

    3. 줄: 18

    4. 문자 : 3​

    5. 코드: 0​

    6. URI: http://localhost/demo/14_Ajax/regist.htm​​

    7. 함수 checkUserid (userId) {// 디스플레이 정보
    8. 매개 변수 없음 선언 된 매개 변수

    cannot enter (xmlhttp.status == 200) {// http
    operates 정상

    aLert ("*****3");

    설명: HTTP이 정상적으로 작동하지 않는데

    HTTP

    상태 코드를 어떻게 반환하나요?

    디버깅 프로세스:

    [html]

    보기 일반복사


    " *****2");

    1.           Alert(xmlHttp.status);

      if (
    2. xmlHttp.status == 200) {// http 작동이 정상입니다
    3. 경고("****** 3");

    4. 데이터가 반환되었지만 서버가 지정된 리소스()를 찾을 수 없고 문서가 존재하지 않습니다! 그리고

      Servlet
    5. 디버깅이 전혀 입력되지 않는 이유는 무엇입니까? ? ?
    6. MLDN 포럼 교사 Li Qi가 답변했습니다. 즉,

      AJAX
    7. 제출 경로에 해당하는 리소스가 존재하지 않는다는 의미입니다.

    8. 당신의

    Servlet
    은 컴파일된

    class

    파일을 프로젝트의

    WEB-INF/classes 디렉토리에 넣어야 하며 추가되지 않은 경우 해당 패키지에 넣어야 합니다. 찾을 수 없습니다

    이 문제가 다시 발생합니다:

    Servlet.java 파일을 WEB-INF/classes 폴더

    에 넣을 필요는 없습니다! ! ! ! ! ! ! ​​​​4f01b97d64aea37f699ead4eb7bd2bbd어디에 배치되나요?

    Other컴파일 오류:

    java.lang.ClassNotFoundException: DBDRIVERClass.forName("DBDRIVER"

    ); // 드라이버를 로드하지 마세요.

    ""

    표시 효과:

위 내용은 Ajax를 사용한 비동기 요청 확인의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.