By GokiSoft.com|
12:14 17/06/2020|
Học PHP
[Share Code] Hướng dẫn tạo máy tính bằng PHP - Sử dụng Ajax - GET/POST form trong PHP - Lập trình PHP
Tạo máy tinh căn bản bằng PHP - Calculator in PHP
Bạn có thể xem cách giải khác giải quyết bài này không sử dụng Ajax -> dùng GET/POST trong form submit Hướng dẫn tạo máy tính bằng PHP - Sử dụng GET/POST form trong PHP - Lập trình PHP
#cal-ajax.html
<!DOCTYPE html>
<html>
<head>
<title>Calculator - Online</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
table{
background-color: #ABB1BA;
margin: auto;
}
#result{
width: 416px;
height: 70px;
}
.btn{
width: 80px;
height: 80px;
}
#equ{
width: 80px;
height: 164px;
}
#zero{
width: 164px;
height: 80px;
}
</style>
</head>
<body>
<table>
<tr>
<td colspan="7"><input id="result" type="text" disabled></td>
</tr>
<tr>
<td><input type="button" class="btn" value="7"></td>
<td><input type="button" class="btn" value="8"></td>
<td><input type="button" class="btn" value="9"></td>
<td><input type="button" class="btn" value="/"></td>
<td><input type="button" class="btn" value="C"></td>
</tr>
<tr>
<td><input type="button" class="btn" value="4"></td>
<td><input type="button" class="btn" value="5"></td>
<td><input type="button" class="btn" value="6"></td>
<td><input type="button" class="btn" value="*"></td>
<td><input type="button" class="btn" value="AC"></td>
</tr>
<tr>
<td><input type="button" class="btn" value="1"></td>
<td><input type="button" class="btn" value="2"></td>
<td><input type="button" class="btn" value="3"></td>
<td><input type="button" class="btn" value="-"></td>
<td rowspan="2"><input id="equ" type="button" class="btn" value="="></td>
</tr>
<tr>
<td colspan="2"><input type="button" id="zero" class="btn" value="0"></td>
<td><input type="button" class="btn" value=","></td>
<td><input type="button" class="btn" value="+"></td>
</tr>
</table>
<script type="text/javascript">
var a = '', b = '', cal = '';
$(function() {
$('input').click(function() {
// console.log($(this).val())
var v = $(this).val()
switch(v) {
case '+':
case '-':
case '*':
case '/':
cal = v
break;
case '=':
//submit data
onSubmit()
break;
case 'AC':
case 'C':
a = ''
b = ''
cal = ''
break;
default:
if(cal != '') {
//nhap B
b += v
} else {
//nhap A
a += v
}
break;
}
$('#result').val(a + cal + b)
})
})
function onSubmit() {
console.log(a+cal+b)
// onSubmitPOST()
onSubmitGET()
}
function onSubmitGET() {
$.get('cal-ajax.php?a='+a+'&cal='+encodeURIComponent(cal)+'&b='+b, function(data) {
console.log(data)
$('#result').val(a+cal+b+'='+data)
})
}
function onSubmitPOST() {
$.post('cal.php', {
'a':a,
'b':b,
'cal':cal
}, function(data) {
console.log(data)
$('#result').val(a+cal+b+'='+data)
})
}
</script>
</body>
</html>#cal-ajax.php
<?php
$a = $b = $cal = $result = '';
if (!empty($_GET)) {
if (isset($_GET['a'])) {
$a = $_GET['a'];
}
if (isset($_GET['b'])) {
$b = $_GET['b'];
}
if (isset($_GET['cal'])) {
$cal = $_GET['cal'];
}
switch ($cal) {
case '+':
$result = $a+$b;
break;
case '-':
$result = $a-$b;
break;
case '*':
$result = $a*$b;
break;
case '/':
$result = $a/$b;
break;
case '%':
$result = $a%$b;
break;
}
}
// POST
if (!empty($_POST)) {
if (isset($_POST['a'])) {
$a = $_POST['a'];
}
if (isset($_POST['b'])) {
$b = $_POST['b'];
}
if (isset($_POST['cal'])) {
$cal = $_POST['cal'];
}
switch ($cal) {
case '+':
$result = $a+$b;
break;
case '-':
$result = $a-$b;
break;
case '*':
$result = $a*$b;
break;
case '/':
$result = $a/$b;
break;
case '%':
$result = $a%$b;
break;
}
}
print($result);Tags:
Phản hồi từ học viên
5
(Dựa trên đánh giá ngày hôm nay)
