用Javascript實現類似兩個選項卡切換的效果,用面向對象編程的方式,實現四則運算和計算矩形面積:
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=GBK" />
<script language="javascript">
<!--
function selType(val){
if(val=='jishuan'){
//顯示四則運算的界面,同時隱藏計算矩形的界面
table1.style.display="block";
table2.style.display="none";
}else if(val=='area'){
//顯示計算矩形的界面,同時隱藏四則運算的界面
table1.style.display="none";
table2.style.display="block";
}
}
//-->
</script>
</head>
<body>
<h1>簡單計算器</h1>
<form action="CatWork.php" method="post">
<input type="radio" name="sel" value="aa" onclick="selType('jishuan')">四則運算
<input type="radio" name="sel" value="bb" onclick="selType('area')">計算矩形
<table id="table1" style="display:block">
<tr><td>請輸入第一個數:</td><td><input type="text" name="num1"></td></tr>
<tr><td>請輸入第二個數:</td><td><input tyep="text" name="num2"></td></tr>
<tr><td>請選擇運算符:</td><td><select name="oper">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select></td></tr>
<tr><td colspan="2"><input type="submit" value="四則運算"></td></tr>
</table>
<!--下面這個table用於顯示計算矩形-->
<table id="table2" style="display:none">
<tr><td>請輸入長:</td><td><input type="text" name="long"></td></tr>
<tr><td>請輸入寬:</td><td><input type="text" name="wid"></td></tr>
<tr><td colspan="2"><input type="submit" value="開始運算"></td></tr>
</table>
</form>
</body>
</html>
<?php
//接收數據
//接收num1,num2,運算符號
require_once 'Cat.class.php';
//首先接收doing
$sel = $_REQUEST['sel'];
$cat1 = new cat();
if ($sel == "aa") {
$num1 = $_REQUEST['num1'];
$num2 = $_REQUEST['num2'];
$oper = $_REQUEST['oper'];
$res = $cat1->jishuan($num1, $num2, $oper);
echo "運算結果是:" . $res . "<br />";
} else if ($sel == "bb") {
$long = $_REQUEST['long'];
$wid = $_REQUEST['wid'];
echo "運算結果是:" . $cat1->JuxingArea($long, $wid);
}
?>
<br/><a href="CatView.php">返回主界面</a>
<?php
//定義類
class Cat {
function JuxingArea($long, $wid) {
return $long * $wid;
}
function jishuan($num1, $num2, $oper) {
switch ($oper) {
case "+":
return $num1 + $num2;
break;
case "-":
return $num1 - $num2;
break;
case "*":
return $num1 * $num2;
break;
case "/":
return $num1 / $num2;
break;
}
}
}
?>
URL:http://www.bianceng.cn/webkf/PHP/201609/50452.htm