> 웹 프론트엔드 > JS 튜토리얼 > Ajax 양식 제출에 대한 우리의 견해와 이해에 대해 이야기해 보겠습니다.

Ajax 양식 제출에 대한 우리의 견해와 이해에 대해 이야기해 보겠습니다.

亚连
풀어 주다: 2018-05-23 11:31:14
원래의
1881명이 탐색했습니다.

Ajax, 비동기 요청, AJAX는 백그라운드에서 서버와 소량의 데이터를 교환하여 웹 페이지를 비동기적으로 업데이트할 수 있습니다. 이 기사를 통해 Ajax 양식 제출에 대한 나의 견해와 이해에 대해 이야기하겠습니다. 관심 있는 친구들은 함께 배울 수 있습니다

ajax(ajax 개발)

AJAX는 "Asynchronous Javascript And XML"(비동기 JavaScript 및 XML)입니다. ) 은 대화형 웹 애플리케이션을 만들기 위한 웹 개발 기술을 말합니다.

AJAX = 비동기 JavaScript 및 XML(표준 범용 마크업 언어의 하위 집합).

AJAX는 빠르고 동적인 웹 페이지를 만드는 기술입니다.

AJAX를 사용하면 백그라운드에서 서버와 소량의 데이터를 교환하여 웹페이지를 비동기적으로 업데이트할 수 있습니다. 이는 전체 페이지를 다시 로드하지 않고도 웹페이지의 일부를 업데이트할 수 있음을 의미합니다.

저는 오랫동안 코드를 배웠지만 Ajax를 거의 사용하지 않습니다. 나중에 자세히 알아보기 위해 Ajax를 처음 사용하는 사람으로서 Ajax에 대한 의견과 이해를 정리했습니다.

Ajax, 비동기 요청, AJAX는 백그라운드에서 서버와 소량의 데이터를 교환하여 웹 페이지를 비동기적으로 업데이트할 수 있습니다. 이는 전체 페이지를 다시 로드하지 않고도 웹페이지의 일부를 업데이트할 수 있음을 의미합니다.

최근 Ajax 양식 제출을 테스트했습니다. 양식 제출에는 게시와 가져오기의 두 가지 유형이 있습니다. POST에 비해 GET이 더 간단하고 빠르며 대부분의 경우에 사용할 수 있습니다.

그러나 다음과 같은 상황에서는 POST 요청을 사용하는 것이 더 효율적입니다.

1. 캐시된 파일을 사용할 수 없습니다(서버의 파일 또는 데이터베이스 업데이트).

2. 서버에 많은 양의 데이터를 보내는 경우(POST에는 데이터가 없습니다.) 크기 제한)

3. 알 수 없는 문자가 포함된 사용자 입력을 보낼 때 POST는 GET

$get 메서드가 양식을 제출하는 것보다 안정적이고 안정적입니다.

get() 메서드는 원격 HTTP GET 요청을 통해 정보를 로드합니다

형식

$(selector).get(url,data,success(response,status,xhr),dataType)
로그인 후 복사

예:

demo.php 웹페이지 요청, 2개의 매개변수 전송, 반환 값 무시:

$.get("demo.php", { 이름: "John", 시간: "2pm" } );

demo.php는 요청을 보낼 URL 주소입니다

{ name: "John", time: "2pm" } 서버로 보낼 데이터입니다.

$POST 메소드를 통해 제출 form

$.post

jQuery.post( url, [data], [callback], [type] ): POST 메서드를 사용하여 비동기 요청을 만듭니다

매개변수:

url(문자열): URL 주소 요청을 보냅니다.

data(Map): (선택) 서버로 보낼 데이터로 키/값 쌍의 형태로 표현됩니다.

callback(함수): (선택) 로딩 성공 시 콜백 함수(Response의 반환 상태가 성공인 경우에만 이 메서드가 호출됩니다).

예를 들어 회원가입 시 사용한 인증코드는

<script type="text/javascript">
function redirect(url) {
location.href = url;
}
$("#code_btn").click(function(){
var tel = $("#username").val();
if(tel == ""){
alert("请输入正确的手机号码作为账号进行注册");
$("#username").focus();
return false;
}
if(!(/^1[3|4|5|8|7][0-9]\d{4,8}$/.test(tel))){
alert("请使用正确的手机号码作为账号进行注册!");
$("#username").focus();
return false;
};
var codeNum = $("#code").val();
$.post( &#39;{APP_PATH}index.php?m=member&c=index&a=public_send_message&#39;, {tel:tel,codeNum:codeNum}, function(result){
// console.log(result);
})
timep(60);
});
function timep(j){
$("#code_btn").attr(&#39;disabled&#39;,"true");
$("#code_btn").val(j+"秒");
time=setInterval(function(){
j=j-1;
$("#code_btn").val(j+"秒");
if(j==0){
$("#code_btn").removeAttr(&#39;disabled&#39;);
clearInterval(time);
j=60;
$("#code_btn").val("点击获取验证码");
}
},1000);
}
</script>
로그인 후 복사

APP_PATH}index.php?m=member&c=index&a=public_send_message가 요청을 보내는 URL 주소

{tel:tel,codeNum:codeNum}가 됩니다. 서버로 전송되는 데이터는 키/값 쌍의 형태로 표현됩니다.

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

데이터베이스 및 Ajax 메소드를 통해 지도 예제 코드 작성

Ajax 도시 이름을 통해 데이터 가져오기

AJAX 요청 대기열 구현

위 내용은 Ajax 양식 제출에 대한 우리의 견해와 이해에 대해 이야기해 보겠습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿