首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 PHP

thinkPHP框架实现的简单计算器示例

Posted in PHP onDecember 07, 2018

本文实例讲述了thinkPHP框架实现的简单计算器。分享给大家供大家参考，具体如下：

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" rel="external nofollow" >
</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 = '/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 = '/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 = '/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);
  }
}

目录结构

thinkPHP框架实现的简单计算器示例

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 */;
---------------------

希望本文所述对大家基于ThinkPHP框架的PHP程序设计有所帮助。

thinkPHP框架实现的简单计算器示例

- Author -

luckymaoyy

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

PHP 相关文章推荐
教你如何把一篇文章按要求分段
Oct 09 PHP
Windows下安装Memcached的步骤说明
Apr 25 PHP
php实现rc4加密算法代码
Apr 25 PHP
php中simplexml_load_string使用实例分享
Feb 13 PHP
CI使用Tank Auth转移数据库导致密码用户错误的解决办法
Jun 12 PHP
PHP上传文件时自动分配路径的方法
Jan 09 PHP
如何使用微信公众平台开发模式实现多客服
Jan 06 PHP
Laravel中使用FormRequest进行表单验证方法及问题汇总
Jun 19 PHP
PHP实现将MySQL重复ID二维数组重组为三维数组的方法
Aug 01 PHP
thinkPHP显示不出验证码的原因与解决方法分析
May 20 PHP
yii2 commands模式以及配置crontab定时任务的方法
Aug 19 PHP
实例讲解PHP页面静态化
Feb 05 PHP
PHP实现的简单留言板功能示例【基于thinkPHP框架】
Dec 07 #PHP
laravel5使用freetds连接sql server的方法
Dec 07 #PHP
php多进程模拟并发事务产生的问题小结
Dec 07 #PHP
Ubuntu 16.04中Laravel5.4升级到5.6的步骤
Dec 07 #PHP
PHP ajax+jQuery 实现批量删除功能实例代码小结
Dec 06 #PHP
PHP实现简易计算器功能
Aug 28 #PHP
laravel5实现微信第三方登录功能
Dec 06 #PHP
apt命令(1) Launch Mode(1) Pickle(1) hashlib(1) netty(1) 类加载器(1) NoSQL(1) 加密(1) 解密(1) logging(1)
You might like
ueditor 1.2.6 使用方法说明
2013/07/24 PHP
php广告加载类用法实例
2014/09/23 PHP
Yii实现文章列表置顶功能示例
2016/10/18 PHP
PHP去除字符串最后一个字符的三种方法实例
2017/03/01 PHP
简单实现php上传文件功能
2017/09/21 PHP
php使用pthreads v3多线程实现抓取新浪新闻信息操作示例
2020/02/21 PHP
JS 显示当前日期与时间的代码
2010/03/24 Javascript
js面向对象 多种创建对象方法小结
2012/05/21 Javascript
给页面渲染时间加速 干掉Dom Level 0 Event
2012/12/19 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(二)人物行走的实现
2013/01/23 Javascript
js 获取元素下面所有li的两种方法
2014/04/14 Javascript
javascript实现显示和隐藏div方法汇总
2015/08/14 Javascript
理解 JavaScript Scoping &amp; Hoisting（二）
2015/11/18 Javascript
如何动态加载外部Javascript文件
2015/12/02 Javascript
用jmSlip编写移动端顶部日历选择控件
2016/10/24 Javascript
使用vue.js实现联动效果的示例代码
2017/01/10 Javascript
JS实现的数组去除重复数据算法小结
2017/11/17 Javascript
微信小程序实现笑脸评分功能
2018/11/03 Javascript
微信小程序实现拍照画布指定区域生成图片
2019/07/18 Javascript
vue的keep-alive用法技巧
2019/08/15 Javascript
js中的面向对象之对象常见创建方法详解
2019/12/16 Javascript
基于JS实现计算24点算法代码实例解析
2020/07/23 Javascript
JavaScript 实现轮播图特效的示例
2020/11/05 Javascript
python根据文件大小打log日志
2014/10/09 Python
在Python的Flask框架中实现全文搜索功能
2015/04/20 Python
python和ruby,我选谁？
2017/09/13 Python
Python中six模块基础用法
2019/12/08 Python
浅谈Python中的模块
2020/06/10 Python
2分钟教你实现环形/扇形菜单(基础版)
2020/01/15 HTML / CSS
采用专利算法搜索最廉价的机票：CheapAir
2016/09/10 全球购物
Hotter Shoes英国官网：英伦风格，舒适的鞋子
2017/12/28 全球购物
ghd澳大利亚官方网站：英国最受欢迎的美发工具品牌
2018/05/21 全球购物
社区综治工作汇报
2014/10/27 职场文书
MySQL系列之十四 MySQL的高可用实现
2021/07/02 MySQL
处理canvas绘制图片模糊问题
2022/05/11 Javascript
在虚拟机中安装windows server 2008的图文教程
2022/06/28 Servers