By GokiSoft.com|
12:13 17/06/2020|
Học PHP
[Share Code] 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
Tạo máy tinh căn bản bằng PHP - Calculator in PHP
Sử dụng Ajax để phát triển bài này Ajax GET/POST trong PHP >> calculator
#calculator.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;
}
}
?>
<!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>
<form method="get" action="" id="MyForm" style="display: none;">
<input required="true" type="number" name="a" placeholder="Enter A" value="<?=$a?>">
<input required="true" type="number" name="b" placeholder="Enter B" value="<?=$b?>">
<select name="cal" required="true">
<option value="">Chọn phép tính</option>
<option value="+" <?=($cal == '+')?'selected':''?>>+</option>
<option value="-" <?=($cal == '-')?'selected':''?>>-</option>
<option value="*" <?=($cal == '*')?'selected':''?>>*</option>
<option value="/" <?=($cal == '/')?'selected':''?>>/</option>
<option value="%" <?=($cal == '%')?'selected':''?>>%</option>
</select>
<!-- <input type="text" name="cal" placeholder="Enter Cal"> -->
<button type="submit">Submit</button>
<p style="font-size: 20px; color:red">
Kết Quả: <?=$result?>
</p>
</form>
<table>
<tr>
<td colspan="7"><input id="result" type="text" value="<?=($a.$cal.$b.'='.$result)?>" 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">
$(function() {
$('input').click(function() {
// console.log($(this).val())
var v = $(this).val()
switch(v) {
case '+':
case '-':
case '*':
case '/':
$('[name=cal]').val(v)
break;
case '=':
//submit data
$('#MyForm').submit()
break;
case 'AC':
case 'C':
$('[name=a]').val('')
$('[name=b]').val('')
$('[name=cal]').val('')
break;
default:
if($('[name=cal]').val() != '') {
//nhap B
$('[name=b]').val($('[name=b]').val() + v)
} else {
//nhap A
$('[name=a]').val($('[name=a]').val() + v)
}
break;
}
$('#result').val($('[name=a]').val() + $('[name=cal]').val() + $('[name=b]').val())
})
})
</script>
</body>
</html>Tags:
Phản hồi từ học viên
5
(Dựa trên đánh giá ngày hôm nay)
