简单的计算器

最新推荐文章于 2024-03-02 21:04:51 发布
最新推荐文章于 2024-03-02 21:04:51 发布
阅读量1k 收藏 1
点赞数 2
分类专栏： PHP 文章标签： php
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/luckymaoyy/article/details/53385564
版权 
HTML部分 文件名 index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算器</title>
    <script type="text/javascript" src="public/js/jquery-2.2.3.js"></script>
    <link rel="stylesheet" href="public/css/index.css">
</head>
<body>
    <div class="login">
            <span>登录</span>
    </div>
    <div class="register">
            <form action="">
                <span>请输入你的手机号开始使用</span>
                <br><br>
                <input id="myphone" type="text">
                <input id="use" type="button" value="使用">
                <br><br>
            </form>
    </div>
    <div class="calculator">
            <div class="counter">
                <span class="brand">计算器</span>
                <br><br>
                <input class="import" type="text" style="text-align: right;">
                <br><br>
                <form class="snap" action="">
                    <br><br>
                    <input class="order" id="one" type="button"  value="1">
                    <input class="order" id="two" type="button" value="2">
                    <input class="order" id="three" type="button" value="3">
                    <input class="order" id="four" type="button" value="4">
                    <input class="order" id="five" type="button" value="5">
                    <br><br>
                    <input class="order" id="six" type="button" value="6">
                    <input class="order" id="seven" type="button" value="7">
                    <input class="order" id="eight" type="button" value="8">
                    <input class="order" id="nine" type="button" value="9">
                    <input class="order" id="zero" type="button" value="0">
                    <br><br>
                    <input class="operator" id="plus" type="button" value="+">
                    <input class="operator" id="add" type="button" value="-">
                    <input class="operator" id="mul" type="button" value="*">
                    <input class="operator" id="sub" type="button" value="/">
                    <input class="" id="equal" type="button" value="=">
                    <br><br>
                    <input class="order" type="button" value=".">
                    <input id="backspace" type="button" value="←">
                    <input id="clear" type="button" value="c">
                    <input type="button" value="CE">
                    <input type="button" value="MC">
                </form>
            </div>
            <div class="result">
                <div>
                    <span>当前结果:</span><span id="current_results"></span>
                </div>
                <br><br>
                <span>历史记录:</span>
                <ul id="cal_result" style="list-style-type: none">
                    <li><span>删除</span></li>
                </ul>
            </div>
    </div>
</body>
    <script type="text/javascript" src="public/js/index.js">

    </script>
</html>
CSS样式 文件名 index.css
.login{/*登录*/
    height: 30px;
    width: 100px;
    background-color: #00a2d4;
    text-align: center;
    cursor: pointer;
    padding-top: 10px;
    position: fixed;
}
.register{
    display: none;
    position: fixed;
}
.calculator{
    display: none;
    position: fixed;
}
.counter{
    border: 1px solid black;
    height: 400px;
    width: 320px;
    float: left;
}
.import{
    height: 20px;
    width: 180px;
    margin-top: 50px;
    margin-left: 50px;
}
.snap{
    margin-left: 50px;
    margin-top: -30px;
}
.snap input{
    height: 30px;
    width: 30px;
}
.result{
    border: 1px solid black;
    height: 400px;
    width: 320px;
    float: left;
    margin-left: 50px;
}
.brand{
    position: relative;
    top: 50px;
    left: 90px;
}

JS部分  文件名 index.js
//计算屏幕宽高
var w_width = $(window).width();
var w_height = $(window).height();

var operator = 0;//运算符号
var change = 0;//属于运算符后需要清空上一数值
var num1 = 0;//元算的第一个数据
var num2 = 0;//运算的第二个数据
var sum = 0;//运算结果
//居中
function setCenter(obj){
    var this_width = $(obj).width();
    var this_height = $(obj).height();
    var this_left = parseInt((w_width-this_width)/2);
    var this_height = parseInt((w_height-this_height)/2);
    $(obj).css({left:this_left,top:this_height});
}
//正则
function testReg() {
    //定义参数
    var regType = arguments[0]?arguments[0]:'phone';
    var myString = arguments[1]?arguments[1]:false;
    var regArray = new Array();
    regArray['phone'] = /^1[3|4|5|7|8]\d{9}$/;
    regArray['email'] = /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/;//邮箱  *代表{0,}　+代表{1,}　?代表{0,1}
    //判断
    if (myString){
        return regArray[regType].test(myString);
    }
    return false;
}
//发送数据到后台
function sendMessage() {
    //手机号
    var myphone = $("#myphone").val();
    //计算器
    var myUrl = '/www.js.net/app/base.php';
    var myData = {num1:num1,num2:num2,cal_option:operator,cal_result:sum,myphone:myphone,type:'add'};
    $.post(myUrl,myData,function (msg) {
        //TODO
    },'json')
    getResultByPhone();
}
//获取结果
function getResultByPhone() {
    var myphone = $("#myphone").val();
    var myUrl = '/www.js.net/app/base.php';
    var myData = {myphone:myphone,type:'getResult'};
    $.post(myUrl,myData,function (msg) {
        //TODO
        $("#cal_result").html(msg);
    },'text')
}

//获取数据
function deleteHistory(id) {
    var myUrl = '/www.js.net/app/base.php';
    var MyData = {id:id,type:'delete'};
    $.post(myUrl,MyData,function (msg) {
        //TODO
    },'json')
    getResultByPhone();
}

$(function () {
    //登录居中
    setCenter($(".login").show(8000));
    //点击登录显示输入
    $(".login").click(function(){
        setCenter($(".register").show());
        $(this).hide();
    });
    //点击使用显示计算器
    $("#use").click(function () {
        if (testReg('phone',$("#myphone").val())){
            setCenter($(".calculator").show());
            $(".register").hide();
            getResultByPhone()
        }else {
            alert ("你输的手机格式不对");
            return false;
        }
    })

    $(".order").click(function () {//点击数字
        var num = $(this).val();
        var oldValue = $(".import").val();
        if (change ==1){
            oldValue = "0";
            change = 0;
        }
        var newValue = "";
        if (num == -1){
            oldValue = parseFloat(oldValue);
            newValue = oldValue * -1;
        }else if (num == "."){
            if (oldValue.indexOf('.') == -1)
                newValue = oldValue + ".";
            else
                newValue = oldValue;
        }else {
            if (oldValue == 0 && oldValue.lastIndexOf('.') == -1){
                newValue = num;
            }else {
                newValue = oldValue + num;
            }
        }
        $(".import").val(newValue);
    });
    $("#clear").click(function () {//清除
        $(".import").val("0");
        operator = 0;
        change = 0;
        num1 = 0;
        num2 = 0;
    });
    $("#backspace").click(function () {//退格
        if (change ==1){
            operator = 0;
            change = 0;
        }
        var value = $(".import").val();
        if (value.length == 1){
            $(".import").val("0");
        }else {
            value = value.substr(0,value.length - 1);
            $(".import").val(value);
        }
    });
    $(".operator").click(function() {//点击运算符号触发事件
        change = 1;
        operator = $(this).val();
        var value = $(".import").val();
        var dianIndex = value.indexOf(".");
        if (dianIndex == value.length) {
            value = value.substr(0, value.length - 1);
        }
        num1 = parseFloat(value);
    });
    $("#equal").click(function () {//点击等号
        var value = $(".import").val();
        var dianIndex = value.indexOf(".");
        if (dianIndex == value.length){
            value = value.substr(0,value.length - 1);
        }
        var equal = $(this).val();
        num2 = parseFloat(value);
        if (operator == "+"){
            sum = num1 + num2;
        }else if (operator == "-"){
            sum = num1 - num2;
        }else if (operator == "*"){
            sum = num1 * num2;
        }else if (operator == "/"){
            sum = num1 / num2;
        }else if (operator == "" || num1 ==0 || num2 == 0){
            sum = num1 +num2;
        }
        var re = /^[0-9]+.?[0-9]*$/;
        if (re.test(sum)){
            sum = sum.toFixed(2);
        }
        $(".import").val(sum);
        sendMessage();
        $("#current_results").text(num1 + operator + num2 + equal + sum);
        change = 1;
        operator = 0;
        num1 = 0;
        num2 = 0;
    });
})
接口 文件名 IDB.php
<?php
namespace mao;
interface IDB{
    public function insert($data);
    public function update($data);
    public function select($data);
    public function del($data);
}
创建一个Mysqli类继承接口实现增删改查
文件名 MySqli.clsaa.php
<?php
namespace mao;
include "IDB.php";

class MySqli implements IDB{
    private $conn = null;
    private $table = null;
    private $sysConfig = array(
        'host' => '',
        'user' => '',
        'pwd' => '',
        'db' => ''
    );
    private static $_instance = null;
    private function __construct($config){
        if(is_array($config)){
            $this->sysConfig = array_merge($this->sysConfig,$config);
            $this->conn = new \Mysqli($this->sysConfig['host'],$this->sysConfig['user'],$this->sysConfig['pwd'],$this->sysConfig['db']);
            if (!$this->conn){
                echo "连接失败".mysqli_error();
            }
        }
    }
    public static function getInstance($config){
        if (is_null(self::$_instance)){
            self::$_instance = new self($config);
        }
        return self::$_instance;
    }
    //设计表
    public function table($table){
        $this->table = $table;
        return $this;
    }
    //查询
    private function changeCondition($condition){
        $where_array = array();
        foreach($condition as $k => $v){
            if(is_array($v)){
                if(strtolower($v[0])=='like'){
                    $where_array[] = $k.' '.$v[0].' \'%'.$v[1].'%\'';
                }else{
                    $where_array[] = $k.' '.$v[0].' \''.$v[1].'\'';
                }
            }
            if(is_string($v)){
                $where_array[] = $k.' = \''.$v.'\'';
            }
        }
        $where = implode(' AND ',$where_array);
        return $where?$where:1;
    }
    public function select($condition){
        $where = $this->changeCondition($condition);
        $sql = "select * from $this->table where ".$where."order by id desc limit 10";
        $res = $this->conn->query($sql);
        $ret = array();
        while ($row = $res->fetch_assoc()){
            $ret[] = $row;
        }
        return $ret;
    }
    public function insert($data){
        $sql = "insert into  `{$this->table}` ( `id` ,`user_phone` ,`num1` ,`num2` ,`option` ,`result` ,`status` ,`admin_user` ) VALUES ( NULL ,  '{$data['myphone']}',  '{$data['num1']}',  '{$data['num2']}',  '{$data['cal_option']}',  '{$data['cal_result']}',  '1',  'mao' )";
        $this->conn->query($sql);
    }    

        public function update($id){
        $sql = "UPDATE  `{$this->table}` SET  `status` =  '-1' WHERE  `id` ={$id}";
        $this->conn->query($sql);
    }
    public function del($condition){

    }
}

配置项  文件名 config.php
<?php
return [
    'db'=>[
        'host' => '127.0.0.1',
        'user' => 'root',
        'pwd' => 'root',
        'db' => 'cal'
    ],
    'author' =>[
        'adminuser' => 'mao',
    ]
];
操作计算器 文件名 base.php
<?php
namespace mao;
define("ROOT_PATH",dirname(dirname(__FILE__)));

$config = include ROOT_PATH."/lib/config/config.php";
include ROOT_PATH."/lib/db/MySqli.class.php";

$db = MySqli::getInstance($config['db']);

if ($_POST){
    //查询
    if ($_POST['type'] == 'getResult'){
        $condition = array(
            'user_phone' =>array('like',$_POST['myphone']),
            'status'=> '1'
        );
        $result = $db->table('calculate')->select($condition);
        $result_string = '';
        foreach ($result as $k => $v){
            $result_string .= "<li><span class='mydelte' onclick='deleteHistory({$v['id']})'>删除</span>{$v['num1']} {$v['option']} {$v['num2']} = {$v['result']} </li>";
        }
        echo $result_string;
    }
    //删除
    if ($_POST['type'] == 'delete'){
        $id = isset($_POST['id'])?$_POST['id']:'';
        $db->table('calculate')->update($id);
    }
    if ($_POST['type'] == 'add'){
        $data = $_POST;
        $db->table('calculate')->insert($data);
    }
}

目录结构
目录结构

sql语句
SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
SET time_zone = "+00:00";


/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8 */;

--
-- 資料庫: `cal`
--

-- --------------------------------------------------------

--
-- 表的結構 `calculate`
--

CREATE TABLE IF NOT EXISTS `calculate` (
  `id` int(10) NOT NULL AUTO_INCREMENT COMMENT '序号 主键 自增',
  `user_phone` varchar(100) NOT NULL COMMENT '用户手机号',
  `num1` varchar(100) NOT NULL COMMENT '第一个数字',
  `num2` varchar(100) NOT NULL COMMENT '第二个数字',
  `option` varchar(10) NOT NULL COMMENT '加减乘除选项',
  `result` varchar(100) NOT NULL COMMENT '结果',
  `status` int(10) NOT NULL COMMENT '状态-1 删除 0 禁用 1 正常',
  `admin_user` varchar(100) NOT NULL COMMENT '管理员',
  PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 COMMENT='计算表' AUTO_INCREMENT=40 ;

--
-- 轉存資料表中的資料 `calculate`
--

INSERT INTO `calculate` (`id`, `user_phone`, `num1`, `num2`, `option`, `result`, `status`, `admin_user`) VALUES
(1, '15727228076', '', '', '', '', 0, ''),
(2, '15727228076', '7', '6', '+', '13', -1, 'jingshan'),
(3, '13880425377', '9', '6', '+', '15', -1, 'jingshan'),
(4, '13880425377', '8', '7', '+', '15', -1, 'jingshan'),
(5, '13880425377', '8', '9', '*', '72', -1, 'jingshan'),
(6, '13880425377', '6', '7', '+', '13', 1, 'jingshan'),
(7, '13880425377', '89', '7', '+', '96', -1, 'jingshan'),
(8, '13880425377', '67', '8', '+', '75', 1, 'jingshan'),
(9, '13880425377', '2', '7', '+', '9', 1, 'jingshan'),
(10, '13880425377', '78', '7', '+', '85', 1, 'jingshan'),
(11, '13880425377', '12', '9', '*', '108', 1, 'jingshan'),
(12, '13880425377', '23', '7', '-', '16', 1, 'jingshan'),
(13, '13880425377', '67', '2', '-', '65', 1, 'jingshan'),
(14, '13880425377', '34', '7', '+', '41', 1, 'jingshan'),
(15, '13880425377', '78', '8', '/', '9.75', 1, 'jingshan'),
(16, '13880425377', '72', '9', '+', '81', 1, 'jingshan'),
(17, '13880425377', '78', '9', '+', '0', 1, 'mao'),
(18, '13880425377', '67', '9', '+', '0', 1, 'mao'),
(19, '13880425377', '78', '9', '+', '0', 1, 'mao'),
(20, '13880425377', '78', '9', '+', '0', 1, 'mao'),
(21, '13880425377', '67', '8', '+', '0', 1, 'mao'),
(22, '13880425377', '62', '8', '+', '0', 1, 'mao'),
(23, '13880425377', '12', '9', '*', '0', 1, 'mao'),
(24, '13880425377', '12', '9', '+', '0', 1, 'mao'),
(25, '13880425377', '7', '8', '-', '0', 1, 'mao'),
(26, '13880425377', '2', '4', '+', '0', 1, 'mao'),
(27, '13880425377', '8', '9', '*', '0', 1, 'mao'),
(28, '13880425377', '8', '9', '+', '0', 1, 'mao'),
(29, '13880425377', '12', '9', '*', '108.00', 1, 'mao'),
(30, '13880425377', '7', '8', '+', '15.00', 1, 'mao'),
(31, '13880425377', '1', '9', '*', '9.00', 1, 'mao'),
(32, '13880425377', '29', '7', '*', '203.00', 1, 'mao'),
(33, '13880425377', '95', '8', '/', '11.88', 1, 'mao'),
(34, '13880425377', '67', '98', '*', '6566.00', 1, 'mao'),
(35, '13880425377', '22', '9', '-', '13.00', 1, 'mao'),
(36, '13880425377', '45', '9', '/', '5.00', 1, 'mao'),
(37, '13880425377', '555', '777', '+', '1332.00', 1, 'mao'),
(38, '13880425377', '89', '0', '-', '89.00', 1, 'mao'),
(39, '13880425377', '0', '89', '0', '89.00', 1, 'mao');

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
luckymaoyy
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
简单计算器
weixin_74801903的博客
11-26 361
编写一个简单计算器类，拥有加减乘除等方法，每个方法都有2个操作数，同为double类型或同为整型，方法设计为重载，在测试类里通过键盘输入操作数，显示计算结果。
个人笔记——图灵机实现函数f(x,y)=ax2+by
南理扛把子的博客
12-21 849
用图灵机实现函数F(X,Y)=aX2+bY， 相当于包含两个部分，第一个部分解决乘法，第二部分解决加法。 采用的是比较传统的单带单道图灵机参数放置如下： q a 0 X 0 X 0 b Y 0 其中q表示的是初始状态，每个参数之间用0隔开区别。 拆分计算aX2，首先计算aX，假设c=aX，紧接着计算cX。 计算aX： （1）读取最左侧的1，将其替换为a并右移，直到遇到第一个0，右移； （2）遇到1则将其替换为x，并右移； （3）重复（2）直至再次遇到0； （4）左移直至遇到a，在右移一次，若遇到1则将其替换
C++计算器（简易版）
jinyanchen的博客
07-27 7590
计算器（简易版） 描述 试编写一个根据用户输入的两个操作数和一个运算符，由计算机输出运算结果的程序。 当操作数是除号("/")时，运算结果是整除的结果，如10/3=3；并且当除数为0时，输出“Error!”。 操作数都是整数。 输入 输入的第一行是两个操作数由一个空格隔开，第二行是一个运算符。 输出 输出一个数，表示运算的结果。 注意除数为0的情况。比如判断字符a是不是加号，可以用 if(a==’+’)来表示，字符要用单个引号括起来。 #include <iostream> using name
使用三种方法来实现简单的计算器
m0_69385954的博客
04-02 169
2.创建一个div标签，给一个id为app，再写两个input标签，选择类型为text输入框，以方便输入数字，使用select标签和option标签来实现加减乘除符号的选择。（1）使用watch侦听器的方法来实。（3）使用computed方法来实现。（2）使用methods方法来实现。三种方法都需要写在vue实例里边。1.导入并连接vue.js。
简易计算器
Bit_Dong的博客
05-21 5888
本节主要讲的是基于51单片机下通过程序配置矩阵按键和数码管制作出一个简单的计算器，实现八位数内加减乘除算法。
51单片机实现简易计算器功能
11-01
本篇文章将深入探讨如何使用51单片机实现一个简易计算器的功能，这通常涉及硬件接口、软件编程以及人机交互设计。 首先，我们要理解51单片机的基本结构。51系列单片机由Intel公司开发，具有8位CPU，内部集成RAM、...
单片机简易计算器课程设计-综合文档
05-23
单片机简易计算器课程设计是针对单片机原理及应用的学习者进行的一项实践项目，旨在让学生掌握单片机控制硬件并实现基本计算功能的能力。在这个设计中，学生使用51系列单片机来构建一个简单的计算器，能够进行加、减...
嵌入式实验报告-简易计算器.pdf
09-29
"嵌入式实验报告-简易计算器.pdf" 本实验报告的主要目的是设计和实现一个具有加减乘除功能的简易计算器，使用数码管和4X4矩阵式键盘来实现计算器的功能。下面是本实验报告的知识点总结： 1. 计算器的原理：计算器...
基于LabVIEW编写的简易计算器
03-19
**基于LabVIEW编写的简易计算器** LabVIEW，全称Laboratory Virtual Instrument Engineering Workbench，是一款由美国国家仪器（NI）公司开发的图形化编程环境，主要用于创建虚拟仪器、数据采集和控制系统的应用...
Qt简单计算器
03-23
【Qt简单计算器】是一个基于Qt框架开发的计算器应用，它主要展示了如何利用Qt库来创建一个用户界面并实现基本的计算功能。Qt是一个跨平台的C++图形用户界面应用程序开发框架，广泛应用于桌面、移动以及嵌入式系统。...
简易计算器（新）
05-25
因之前发了一个计算器的源码，存在一点小bug，这里优化完成，所以重新发一下，欢迎下载学习
使用C语言实现简单计算器
最新发布
2301_82247031的博客
03-02 4404
计算器是我们生活中很常用的工具，作为一个在学习编程语言的我们，也需要用代码来实现一个计算器的代码，我们就用C语言来实现一个进行计算两个数字的简单计算器：
c语言 简易计算器
jaket5219999的博客
11-18 7086
应度友邀请，用c写了个简易的命令行计算器，其功能大致如下： 设计简单的计算器，允许用户输入简单表达式（一元运算和二元运算表达式，以=结尾），输出计算结果，并等待用户继续输入，直到用户输入字符q。 输入输出举例 ： 输入：10^2= // 求幂运算，指数必须整数 输出：100 输入：5!= //阶乘运算 输出：120 输入：9$= //判断是否平方数
简易计算器（详解用栈实现算术表达式求值）
CXR_XC的博客
11-19 5319
C++详解用栈实现简易计算器，即表达式求值
2020年团体程序设计天梯赛-总决赛 L2-1 简单计算器
weifeng2356的博客
11-29 3312
简单计算器
简单计算器的实现
wbj1250029117的博客
11-04 1522
简单计算器的实现
Lesson_5 作业_1 ---- 简单计算器模拟
HouRui2000的博客
01-16 317
一、作业描述　 　　编写Java程序，模拟简单的计算器。 　　定义名为Number的类，其中有两个整型数据成员n1和n2，应声明为私有。编写构造方法，赋予n1和n2初始值，再为该类定义加（addition）、减（subtraction）、乘（multiplication）、除（division）等公有成员方法，分别对两个成员变量执行加、减、乘、除的运算。 　　在main方法中创建N...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值