
搜索你喜欢的设计

搜索
开发工具
26个工具
站长工具
24个工具
多媒体
41个工具
多媒体
随机密码生成
字符串加密工具
ico图标转换制作
图片base64互转工具
图片颜色分析
图片压缩工具
批量修改图片尺寸工具
批量图片格式转换工具
在线批量图片翻转工具
图片批量加水印工具
批量图片旋转工具
在线批量压缩图片
批量在线抠图工具
GIF动画分解合成工具
图片切割工具
图片在线裁剪工具
二维码生成
九宫格图片合成
RGB颜色数值转换
条形码在线生成
在线图片滤镜
图片隐藏文字
图片转ASCII字符图
音乐剪辑器
在线视频截取
视频转gif
视频格式转换
图片圆角
多宫格图片合成
图片叠加
图片拼接
图片转正方形
彩色文字生成
图片添加文字
音频提取
照片换背景色
视频合并
mp3音乐合并
未读消息头像生成
音频叠加
视频添加声音
生活查询
38个工具
广告位招租
TEL:18084881111
使用php或js代码实现简单的在线计算器功能
编辑: QTOOL.NET
日期: 2019-02-27
824
本文简单介绍了怎样使用一些php代码与js代码制作一款简洁小巧的在线工具。
首先新建一个XXX.php的文件,然后输入以下html代码.
<form action="/xxx.php" method="post">
<input type="text" size="13" name="jssz1" value="<?php if(!empty($jssz1)){echo $jssz1;}?>" />
<select name="dxan">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" size="13" name="jssz2" value="<?php if(!empty($jssz2)){echo $jssz2;}?>" />
<input type="anniumit" name="anniu" value="计算" />
</form>
然后继续输入以下php代码
<?php
//判断用户是否点击了按钮提交了两个数字的表单
if(isset($_POST["jssz1"]) && isset($_POST["jssz2"])){
if(empty($_POST["jssz1"])){
//判断输入提交的第一个数字是否为空,为空则输出
echo "第一个数字不允许为空白";
unset($_POST["anniu"]);//销毁post提交的内容,后面计算将不执行
}
if(empty($_POST["jssz2"])){
//判断输入提交的第二个数字是否为空,为空则输出
echo "第二个数字不允许为空白";
unset($_POST["anniu"]);}
$dxan=$_POST["dxan"];
//判断加减乘除类别
$jssz1=$_POST["jssz1"];
//获取第一个数
$jssz2=$_POST["jssz2"];
//获取第二个数
if($dxan == "/"){
if($jssz2 == 0){
echo "除数不能为0";
unset($_POST["anniu"]);
}
}
}
//通过$_POST["anniu],判断是否点击了计算按钮
if(isset($_POST["anniu"]) && !empty($_POST["anniu"])){
//通过判断提交的符号选择来执行那种运算
switch($dxan){
case "+"://如果为加号
$jjjg = $jssz1+$jssz2;
break;
case "-"://如果为减号
$jjjg = $jssz1-$jssz2;
break;
case "*"://如果为乘号
$jjjg = $jssz1*$jssz2;
break;
case "/"://如果为除号
$jjjg = $jssz1/$jssz2;
break;
}
echo "<input type=\"text\" id=\"jjjg\" value=".$jjjg." />";//第三个文本框中输出计算结果
}
?>
在完成输入以上代码内容后,我们保存为XXX.php,然后放在本地服务器的网站根目录下输入localhost/xxx.php即可测试运行这一款在线计算器
那么我们该怎样使用js实现简单的小计算器功能呢?
新建一个XXX.html文件在body中输入以下代码
<script type="text/javascript">
function jsjg(){
var a = document.getElementById("num1").value;//a获取第一个输入框的数字
var b = document.getElementById("num2").value;//获取第二个输入框的数字
var c = document.getElementById("xk").value;//获取选择框符号
a = parseFloat(a);//字符串返回数字
b = parseFloat(b);//字符串返回数字
switch(c){ //判断选框符号来执行相关数字运算,获得运算结果
case "+":
document.getElementById("jjjg").value=parseInt(a)+parseInt(b);
break;
case "-":
document.getElementById("jjjg").value=parseInt(a)-parseInt(b);
break;
case "*":
ocument.getElementById("jjjg").value=parseInt(a)*parseInt(b);
break;
case "/":
document.getElementById("jjjg").value=parseInt(a)/parseInt(b);
break;
}
}
</script>
<input type="text" id="num1" />
<select id='xk'>
<option value="+">+</option>
<option value="-" c>-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" id="num2" />
<input type="button" value=" = " onclick ="jsjg()"/>
<input type="text" id="jjjg" />

我们可以在第一个文本框中输入第一个数字,选择运算符号,然后继续在第二个文本框中输入第二个数字,点击计算或等号按钮,即可在下方显示数字运算结果.
此文章由QTOOL.NET编辑
热门文章
最新文章
热门标签