jquery의 ajax를 사용하여 양식 데이터를 비동기식으로 제출하는 방법

이번에 보여드릴 내용은 jquery의 ajax를 사용하여 양식 데이터를 비동기적으로 제출하는 방법입니다. jquery의 ajax 메서드를 사용하여 양식을 비동기적으로 제출하면 json 데이터가 백그라운드에서 반환되고 처리됩니다. 페이지를 새로 고치지 않고 콜백 함수를 사용하면 이 글에서 비동기의 목적을 잘 분석할 수 있습니다.

양식에서 처리된 데이터는 serialize() 메서드를 사용하여 직렬화할 수 있습니다. 제출된 데이터에 파일 스트림이 포함된 경우 FormData 개체를 사용해야 합니다.

파일이 없는 양식 데이터 사용: var data = $( form ).serialize();

html: form form

<form id="addForm" action="${pageContext.request.contextPath}/admin/saveAdd" method="post">    
  <input type="text" name="name" placeholder="请输入名字" />
  <input type="password" name="password" placeholder="密码"/>
 </form>

jquery 비동기 처리

$("#submitAdd").click(function(){
     
  var targetUrl = $("#addForm").attr("action");    
  var data = $("#addForm").serialize();     
   $.ajax({ 
    type:'post',  
    url:targetUrl, 
    cache: false,
    data:data,  
    dataType:'json', 
    success:function(data){      
      alert('success');
    },
    error:function(){ 
     alert("请求失败")
    }
   })
     
})

위의 소개를 읽으신 후 방법을 마스터하셨으리라 믿습니다. PHP 중국어 웹사이트 기타 관련 기사도 주목해주세요!

관련 자료:

jQuery를 사용하여 배열 중복 제거 및 정렬

JS

PHP A에는 몇 개의 체인 작업이 있습니까? 그것을 달성하는 방법

위 내용은 jquery의 ajax를 사용하여 양식 데이터를 비동기식으로 제출하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!