본문 바로가기
Python/Muzi

Jquery강화학습07. 홀짝 게임만들기

by 미눅스[멘토] 2023. 7. 13.
728x90

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
#it_mine, #it_com, #it_result{
	width: 40px
}

</style>
<script>

// function myclick(){
// 	var rnd = parseInt(Math.random()*2);
// 	var me = document.querySelector('#it_mine').value;
// 	var com=""
// 	if(rnd>0){
// 		com ="홀"
// 	}else{
// 		com="짝"
// 	}
// 	document.querySelector('#it_com').value = com
	
// 	if(me==com){
// 		document.querySelector('#it_result').value = "승리"
// 	}else{
// 		document.querySelector('#it_result').value = "패배"
// 	}
// 	console.log()
// }
function myclick(){
	
	var obj_mine =$('#it_mine');
	console.log(obj_mine)
	var obj_com = $('#it_com');
	var obj_result = $('#it_result');
	
	var mine = obj_mine.val();
	var com = "";
	var result ="";
	
	var rnd = parseInt(Math.random()*2);
	var com=""
	
	if(rnd>0){
		com="홀"
		obj_com.val("홀")
	}else{
		com="짝"
		obj_com.val("짝")
	}
	console.log(com)
	
	
	if(mine==com){
		result = "승리"
	}else{
		result = "패배"
	}
	obj_com.val(com)
	obj_result.val(result)
}

$(function(){
	$('#btn').bind('click',function(){
		myclick()
	})
})

</script>

</head>
<body>
EX07

<table border="1">
	<tr>
		<td>나</td>
		<td>
			<input type="text" id="it_mine" />
		</td>
	</tr>
	<tr>
		<td>컴</td>
		<td>
			<input type="text" id="it_com" />
		</td>
	</tr>
	<tr>
		<td>결과</td>
		<td>
			<input type="text" id="it_result" />
		</td>
	</tr>
	<tr>
		<td colspan="2">
			<input type="button" value="게임하기" id="btn"/>
		</td>
	</tr>
</table>
</body>
</html>

 

 

나에다가 홀/짝을 입력 후 게임하기를 클릭하면