javascript로 이중저장/결제 방지

Remark : 한페이지에서 Ajax 로 데이타 저장시 시간이 많이 걸릴 경우, 버튼이중 클릭시 중복저장됩니다.

버튼 disable 처리는 속성처리라 한번만 가능
ajax async: false 는 추천하지 않는 방식.

버튼에 vaule=0 값 주어 처리


<!DOCTYPE HTML>
<html lang="ko">
<head>
	<meta charset="UTF-8" />
<script type="text/javascript">
		
	var Payment = function () {
	
	     var saveBtn = document.querySelector("#savebtn").value;
		 //alert(saveBtn);
		 if (saveBtn=='1')
		 {
		    //alert('저장(결제)하기가 진행 중입니다.')
			return 0;
		 }
		 	
		if (confirm('저장(결제)하시겠습니까?')) {
			
			document.querySelector("#savebtn").value = '1';
		    //alert(document.querySelector("#savebtn").value);
			
			//실패 테스트 
			if (confirm('저장(결제)가 실패되었습니까? \r\n 다시 수정후 결제 하기 위해 0 로')) { 
			    document.querySelector("#savebtn").value = '0';
				return 0;
			}
			
			return 0;
		}		
	}
</script>
</head>

<!-- Button trigger modal -->
<div class="btn_wp">
	<button type="button" id="savebtn" class="bt lg act" value="0" onclick="return Payment();">저장(결제)하기</button>
</div>

</html>

<!DOCTYPE HTML>

<head>

var Payment = function () {

var saveBtn = document.querySelector("#savebtn").value;

//alert(saveBtn);

if (saveBtn=='1')

{

//alert('저장(결제)하기가 진행 중입니다.')

return 0;

}

if (confirm('저장(결제)하시겠습니까?')) {

document.querySelector("#savebtn").value = '1';

//alert(document.querySelector("#savebtn").value);

//실패 테스트

if (confirm('저장(결제)가 실패되었습니까? \r\n 다시 수정후 결제 하기 위해 0 로')) {

document.querySelector("#savebtn").value = '0';

return 0;

}

return 0;

}

</script>

</head>

</div>

</html>