首页 > 代码库 > 利用javascript、php和ajax实现计算器

利用javascript、php和ajax实现计算器

计算器和ajax部分:

<?php/** * Created by PhpStorm. * User: Administrator * Date: 16-9-2 * Time: 上午9:20 * * 计算器_GET * */?><script type="text/javascript">    function loadXMLDoc(){        var xmlhttp;        if(window.XMLHttpRequest)            xmlhttp=new XMLHttpRequest(); //IE7+ FF GG        else            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");//IE5 6        xmlhttp.onreadystatechange=function(){            if(xmlhttp.readyState==4 && xmlhttp.status==200){                //alert(xmlhttp.responseText);                document.getElementById("result").value=http://www.mamicode.com/xmlhttp.responseText;"val1").value;        dtype=document.getElementById("vtp").value;        data2=document.getElementById("val2").value;        xmlhttp.open("GET","test.php?data1="+data1+"&dtype="+dtype+"&data2="+data2, true);        xmlhttp.send();    }</script><p>    <input type="text" name="val1" id="val1">    <select name="vtp" id="vtp">        <option value="http://www.mamicode.com/add">+</option>        <option value="http://www.mamicode.com/sub">-</option>        <option value="http://www.mamicode.com/mul">*</option>        <option value="http://www.mamicode.com/del">/</option>    </select>    <input type="text" name="val2" id="val2">    <button id="calcBtn" onclick="loadXMLDoc()">=</button>    <input type="text" name="result" id="result"></p>

  运算部分:

<?php$data1=floatval($_GET[‘data1‘]);$dtype=$_GET[‘dtype‘];$data2=floatval($_GET[‘data2‘]);if($dtype!="add" && $dtype!="sub" && $dtype!="mul" && $dtype!="del")    die("error");if(empty($data1) || empty($data2))    die("error");if($dtype=="del" && $data2==0)    die("0");$rwt=0;switch($dtype){    case "add":        $rwt=$data1 + $data2;        break;    case "sub":        $rwt=$data1 - $data2;        break;    case "mul":        $rwt=$data1 * $data2;        break;    case "del":        $rwt=$data1 / $data2;        break;    default:        $rwt=0;}echo $rwt;

实现效果:

技术分享

 

利用javascript、php和ajax实现计算器