100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > 求根计算机 jQuery实现的简单计算器功能

求根计算机 jQuery实现的简单计算器功能

时间:2021-01-11 05:38:04

相关推荐

求根计算机 jQuery实现的简单计算器功能

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

先来看看运行效果图:

完整代码如下:

/p>

"/TR/xhtml1/DTD/xhtml1-transitional.dtd">

jQuery计算器

.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;

}

-->

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;

}

$(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);

});

});

// -->

jQuery简单计算器 第一个数: 第二个数: 结果:

PS:这里再为大家推荐几款在线计算工具供大家参考使用:

在线一元函数(方程)求解计算工具:/jisuanqi/equ_jisuanqi

科学计算器在线使用_高级计算器在线计算:/jisuanqi/jsqkexue

在线计算器_标准计算器:/jisuanqi/jsq

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

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。