jQuery 는 Ajax 방식 으로 양식 을 제출 합 니 다.

제출 양식 은 일반적으로 동기 화 방식 으로 제출 되 며, 제출 후 페이지 를 새로 고치 거나 새 페이지 로 이동 하여 서버 측 이 되 돌아 오 는 처리 결 과 를 표시 합 니 다.폼 을 제출 한 후에 다른 작업 이나 업무 수요 가 이 페이지 에 표시 되 거나 처리 되 어야 한다 면 페이지 를 전체적으로 새로 고 칠 수 없습니다. 이때 가장 먼저 생각 나 는 것 은 ajax 방식 으로 폼 을 제출 하 는 것 입 니 다.다음은 양식 을 ajax 방식 으로 제출 하 는 절 차 를 완전 하 게 소개 합 니 다.
준비 하 다
1. 페이지 에 jQuery 파일 도입
2, 페이지 도입 jQuery 폼 플러그 인 jQuery. form. js
실시
1. 페이지 의 폼

2. 양식 을 제출 하 는 코드
$("#agreementSub").on("click",function(){
       $('#mainForm').ajaxSubmit(      //ajax      
			{
				url: '/personal/kaike',
				type: 'post',
				dataType: 'json',
				beforeSubmit: function () {},
				success: function (data) {
					if (data.Res == "True" || data.Res == true) {
						$('.jsrz_main_check').html('       ，     1-2         ，     !');
					} else {
						alert(data.Msg);
					}
				},
				clearForm: false,//      
				resetForm: false //      
			});
});

제출 단 추 를 누 르 면 바 인 딩 된 click 이벤트 가 발생 합 니 다.
$('#mainForm').ajaxSubmit(）//                ，       。

3. jQuery. from 폼 플러그 인 을 사용 하지 않 는 방식
$("#maniForm").submit(function (envent)
{
    envent.preventDefault();
    
    var form = $(this);
    $.ajax({
        url: form.attr("action"),
        type: form.attr("mathod"),
        data: form.serialize(),
        dataType: "json",
        beforeSend: function ()
        {
            $("#ajax-loader").show();
        },
        error: function ()
        {

        },
        complete:function () {
            $("#ajax-loader").hide();
        },
        success: function (data)
        {
            $("#article").html(data);
        }
    });
});

주: 폼 에 submit 형식의 input 단추 가 있어 야 submit 방법 을 활성화 할 수 있 습 니 다.이 제출 방식 은 폼 의 간단 한 텍스트 항목 만 제출 할 수 있 고 file 형식의 데 이 터 는 제출 할 수 없습니다.input 제출 단추 의 id 와 name 속성의 값 은 submit 일 수 없습니다. 그렇지 않 으 면 충돌 하여 폼 을 제출 할 수 없습니다.
jQuery 는 ajax 를 통 해 배경 json 데 이 터 를 얻어 form 폼 에 값 을 부여 합 니 다.
스 레 드 노트: Future 모드

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage