AJAX 애플 리 케 이 션 등록 사용자 즉시 검색

AJAX 의 리 셋 없 는 시스템 은 등록 시스템 에서 등록 이름 에 대한 검 측 을 즉시 표시 할 수 있 습 니 다.흔히 볼 수 있 는 사용자 등록 은 사용자 가 사용자 이름 을 입력 하 는 것 입 니 다.배경 프로그램 에서 데이터베이스 에 사용자 이름 이 중복 되 는 지 확인 하여 등록 의 성공 과 실 패 를 알 리 는 것 입 니 다.(사용자 가 이름 을 바 꿀 때 다시 등록 합 니 다)또는 사용자 이름 텍스트 상자 에 검 측 단 추 를 추가 하여 사용자 가 검 측 한 후에 등록 하도록 하 는 것 입 니 다.이상 의 조작 은 사용자 체험 에 있어 서 비교적'형편없다'는 것 이다.좋 은 사용자 체험 은 사용자 가 등록 사용자 이름 을 입력 한 후에 웹 시스템 은 즉시 검사 하고 즉시 표시 할 수 있 으 며 검사 와 표시 하 는 동시에 현재 페이지 의 조작 에 영향 을 주지 않 는 다 는 것 이다.이것 은 바로'비동기 데이터 획득'의 요구 입 니 다.이것 은 바로 AJAX 의 강점 입 니 다.예 를 들 어 다음 과 같은 예제 에서 AJAX 의 이 기능 을 보 여 줍 니 다http://www.cnbruce.com/test/ajax/t1.htm이미 존재 하 는 사용자 이름(예 를 들 어 cnbruce,cnrose)을 입력 할 때 페이지 에 이름 을 바 꾸 면 등록 할 수 없습니다(false)를 표시 합 니 다.그렇지 않 으 면 등록 할 수 있 음(true)을 보 여 줍 니 다.이것 은 사용자 의 등록 에 빠 른 참 고 를 제공 합 니 다.사용자 체험 지상.그렇다면 이런 기능 을 어떻게 실현 하 는 지 살 펴 보 자.사실 위 와 같은 t1.htm 소스 코드 를 통 해 AJAX 의 정 수 를 볼 수 있 습 니 다.먼저 XML Http 대상 을 정의 합 니 다.
var xmlHttp = false;try {  xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");} catch (e) {  try {    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");  } catch (e2) {    xmlHttp = false;  }}if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {  xmlHttp = new XMLHttpRequest();}이 부분 에 대한 설명 은 다음 을 보십시오http://www.cnbruce.com/blog/showlog.asp?cat_id=34&log_id=987다음은 사용자 정의 함수 입 니 다.
function callServer() {  var u_name = document.getElementById("u_name").value;  if ((u_name == null) || (u_name == "")) return;  var url = "cu.asp?name=" + escape(u_name);  xmlHttp.open("GET", url, true);  xmlHttp.onreadystatechange = updatePage;  xmlHttp.send(null);  }이 함수 의 주요 기능 은 비동기 적 으로 cu.asp 의 내용 을 얻 는 것 입 니 다.그 전에 현재 페이지 의 폼 요 소 를 먼저 추출 합 니 다."uname 사용자 이름 텍스트 상자 zhogn 의 값 은 cu.asp 이후 의 매개 변수 와 할당 을 통 해 서로 다른 결 과 를 얻 었 습 니 다(true). or false)。그러면 여기 서 말 하고 자 하 는 것 은 cu.asp 입 니 다.그의 주요 기능 은 URL 매개 변수 name 의 값 을 받 아들 여 내용 을 표시 하 는 것 입 니 다.이 내용 은 최종 적 으로 t1.htm 비동기 로 가 져 옵 니 다.
<%name=request.querystring("name")Set rs = Server.CreateObject ("ADODB.Recordset")sql = "Select * from u_ser where u_name='"&name&"'"rs.Open sql,conn,1,1if rs.eof and rs.bof then    response.write("true")else    response.write("false")end ifrs.closeset rs=nothingcall CloseDatabase%>비동기 로 얻 은 정 보 를 현재 페이지 에 표시 하 는 방법
function updatePage() {  if (xmlHttp.readyState < 4) {    test1.innerHTML="loading...";  }  if (xmlHttp.readyState == 4) {    var response = xmlHttp.responseText;    test1.innerHTML=response;  }}그 중에서 xmlHttp.ready State 의 ready State 는 서버 가 요청 을 처리 할 때의 진행 상황 을 표시 합 니 다.그 값 은 각각 0-4 이 고 각각 설명 상황 이 있 습 니 다.구체 적 으로 참고 하 십시오http://www.cnbruce.com/blog/showlog.asp?cat_id=34&log_id=718DHTML 의 innerHTML 을 사용 하면 정 의 된 정 보 를 표시 할 수 있 습 니 다. 등록 가능 여부 올라가다나머지 폼 페이지 는 압축 파일 다운로드(다운로드 후 접 두 사 를 설명 하지 않 음) .cnbruce 으로 변경 .rar): http://www.cnbruce.com/test/ajax/ajax.cnbruce

좋은 웹페이지 즐겨찾기