怎么申请小程序_jQuery完成的简略在线核算器功用

jQuery实现的简单在线计算器功能       这篇文章主要介绍了jQuery实现的简单在线计算器功能,结合完整实例形式分析了jQuery实现简单四则运算的相关操作技巧,需要的朋友可以参考下

本文实例讲述了jQuery实现的简单在线计算器功能。分享给大家供大家参考，具体如下：

先来看看运行效果图：

完整代码如下：

 !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"TR/xhtml1/DTD/xhtml1-transitional.dtd" 
 html xmlns="1999/xhtml" 
 head 
 meta http-equiv="Content-Type" content="text/html; charset=utf-8" / 
 title jQuery计算器 /title 
 style type="text/css" !--
 .div{
 border:green 1px;
 border-style:solid;
 width:300px;
 text-align:center;
 span{
 background-color:#CCCCCC;
 font-size:32px;
 font-family:"微软雅黑";
.input{
 border: 1px solid #6666FF;
-- /style style type="text/css" .div{
 border:green 1px;
 border-style:solid;
 width:300px;
 text-align:center;
 span{
 background-color:#CCCCCC;
 font-size:32px;
 font-family:"微软雅黑";
.input{
 border: 1px solid #6666FF;
} /style 
 script src="jquery-1.7.2.min.js" type="text/JavaScript" /script 
 script language="javascript" !--
$(document).ready(function() {//传说中的ready
$("form div input:text").addClass("input");//找到form里面div包含的input标签类型为text的元素 jQuery强悍
var num1,num2;
$("#jia").click(function() {
num1=parseFloat($("#num1").val());
num2=parseFloat($("#num2").val());
$("#reset").val(num1+num2);
$("#jian").click(function() {
num1=parseFloat($("#num1").val());
num2=parseFloat($("#num2").val());
$("#reset").val(num1-num2);
$("#cheng").click(function() {
num1=parseFloat($("#num1").val());
num2=parseFloat($("#num2").val());
$("#reset").val(num1*num2);
$("#chu").click(function() {
num1=parseFloat($("#num1").val());
num2=parseFloat($("#num2").val());
$("#reset").val(num1/num2);
// -- /script 
 /head 
 body 
 form 
 div 
 div span jQuery简单计算器 /span /div 
 div 第一个数: input type="text" id="num1" /div 
 div 第二个数: input type="text" id="num2" /div 
 div input type="button" value=" + " id="jia" input type="button" value=" - " id="jian" input type="button" value=" * " id="cheng" input type="button" value=" / " id="chu" /div 
 div 结果: input type="text" id="reset" / /div 
 /div 
 /form 
 /body 
 /html 

凡科抠图：这里再为大家推荐几款在线计算工具供大家参考使用：

在线一元函数（方程）求解计算工具：

科学计算器在线使用_高级计算器在线计算：

在线计算器_标准计算器：

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《》、《》、《》、《》、《》、《》、《》及《》

希望本文所述对大家jQuery程序设计有所帮助。