Front-End/jQuery

ajax 사용

doriver 2024. 4. 24. 13:55

ajax를 사용할 페이지에서 jquery파일을 로드함

 

버튼 클릭했을때 function(){ } 속에서 $.ajax( { } ); 실행

 

<body>
    성명
    <input type="text" id="name">
	<button id="bbb">ajax요청</button>

	<script>
		$("#bbb").click( 
			function(){
				var params = {
						nnn: $("#name").val()
				} <!-- ajax통신에서 보낼 데이터 형식 { a: b , c: d } -->
				
				$.ajax({
					type:"post", <!-- http method -->
					url:"/c01/aaa", <!-- 요청 url -->
					data:params, <!-- 전송 데이터 -->
					success:function(res){  <!-- 요청,응답 성공했을때 -->
						alert(res);
					},
					error:function(xhr, status, error){ <!-- 통신 실패했을때  -->
						alert(xhr.responseText);
					}
				});
			}		
		);
	</script>
</body>