$.ajax()实现简单计算器
1、html页面 a.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>calculate</title>
</head>
<body>
<input type = "text" name="num1" id="num1">
<select name = "select" id="select">
<option value="+" >+</option>
<option value="-" >-</option>
<option value="*" >*</option>
<option value="/" >/</option>
</select>
<input type = "text" name="num2" id="num2" >
<input type = "submit" name = "submit" id="submit" value="=">
<input type = "text" name="result" id='result' placeholder="结果显示">
<script src="jquery.min.js"></script>
<script type="text/javascript">
$('#submit').click(function(){
var data={'num1':$('#num1').val(),'num2':$('#num2').val(),'select':$("#select").val()};
$.ajax({
type:'get',
url:'a.php',
data:data,
dataType:'json',
success:function(data){
$('#result').val(data);
},
error:function(error){
alert('no');
}
});
});
</script> </body>
</html>
2、php页面 a.php
<?php
$data=$_GET;
$num1=$data['num1'];
$num2=$data['num2'];
$select=$data['select'];
if(is_numeric($num1) && is_numeric($num2)){
switch($select){
case '+':
$result=$num1+$num2;break;
case '-':
$result=$num1-$num2;break;
case '*':
$result=$num1*$num2;break;
case '/':
$result=$num1/$num2;break;
}
} echo json_encode($result);
随机推荐
- iOS QQ分享图片无反应问题
受iOS 9 上 http 限制 需要在info.plist文件添加必要string <key>LSApplicationQueriesSchemes</key> <ar ...
- python与 Ajax跨域请求
同源策略 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说Web是构建在同源策略基础之上的 ...
- 登录模块的进化史,带大家回顾java学习历程(二)
接着前面的登录模块的进化史,带大家回顾java学习历程(一) 继续往下面讲 前面我们去实现登录功能,都是想着要完成这个功能,直接在处理实际业务的类中去开始写具体的代码一步步实现,也就是面向过程的编程. ...
- 远程SCP报错,报22号口错误
格式: scp root@ip地址/远程服务器文件地址 本地服务器地址 查看了半天发现无法联通,最终22端口不通 后来经过同事提示,忽然想到要经过跳板进行转发才能够登录. 想到自己配置了ssh文件 直 ...
- flask-sqlalchemy基本操作数据库
# -*- coding: utf-8 -*- from sqlalchemy.ext.declarative import declarative_base from sqlalchemy impo ...
- VS工程中添加c/c++工程中外部头文件及库的基本步骤
转载自 在VS工程中,添加c/c++工程中外部头文件及库的基本步骤: 1.添加工程的头文件目录:工程---属性---配置属性---c/c++---常规---附加包含目录:加上头文件存放目录. 2.添加 ...
- JS原型、原型链深入理解
原型是JavaScript中一个比较难理解的概念,原型相关的属性也比较多,对象有”prototype”属性,函数对象有”prototype”属性,原型对象有”constructor”属性. 一.初识原 ...
- SpringMVC整合Shiro权限框架
尊重原创:http://blog.csdn.net/donggua3694857/article/details/52157313 最近在学习Shiro,首先非常感谢开涛大神的<跟我学Shiro ...
- 微信小程序监听input输入并取值
小程序的事件分为两种,冒泡和非冒泡事件,像<form/>的submit事件,<input/>的input事件,<scroll-view/>的scroll事件等非冒泡 ...
- java 跳出多层循环
lableB: for(int i=0;i<10;i++){ lableA: for(int j=0;j<10;j++){ System.out.println(j); if(j==1){ ...