2017-11-28 clac 简易计算器

最新推荐文章于 2022-07-02 23:58:02 发布

iris w

最新推荐文章于 2022-07-02 23:58:02 发布

阅读量283

点赞数

分类专栏：第一个月html css js jq

本文链接：https://blog.csdn.net/qq_39509597/article/details/78831996

版权

第一个月html css js jq 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

使用js写的简易计算器

使用到了innerHTML，数据的转换parseInt

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript">
	//x表示第一个运算数据，y表示第二个运算数据
	var x = 0, y = 0;
	var calc = "";
function get()
	{
		var obj = document.getElementById("user"); //根据ID获取某个标签对象
		alert(obj.value);
	}
	//调用click1函数，并且给一个实参1
	
	
	function click1(obj)
	{
		var o = document.getElementById("data");
		//v是原来文本框的值,obj.value是现在新输入的数字
		var v = o.value;
		o.value = v + obj.value;
	}
	//运算符按钮单击后执行的方法
	function op(obj)
	{
		var o = document.getElementById("data");
		var o1 = document.getElementById("sp");

		calc = obj.value;
		x = parseInt(o.value);
		
		o1.innerHTML = o.value + calc;
		o.value = "";
	}
	//=号按钮的单击事件
	function calca(obj)
	{
		var o = document.getElementById("data");
		
		y = parseInt(o.value);

		if(calc == "+")
			{
				o.value = x + y;
			}
		else if(calc == "-")
			{
				o.value = x - y;
			}
		else if(calc == "*")
			{
				o.value = x * y;
			}
		else if(calc == "/")
			{
				o.value = x / y;
			}
	}
</script>
</head>

<body>


<table>
<tr>
	<td colspan="4">
		<input type="text" readonly id="data"/>
		<span id="sp"></span>
	</td>
	
</tr>
	<tr>
		<td><input onClick="click1(this)" type="button" value="1"></td>
		<td><input onClick="click1(this)" type="button" value="2"></td>
		<td><input onClick="click1(this)" type="button" value="3"></td>
		<td><input onClick="click1(this)" type="button" value="4"></td>
	</tr>
	<tr>
		<td><input onClick="click1(this)" type="button" value="5"></td>
		<td><input onClick="click1(this)" type="button" value="6"></td>
		<td><input onClick="click1(this)" type="button" value="7"></td>
		<td><input onClick="click1(this)" type="button" value="8"></td>
	</tr>
	<tr>
		<td><input onClick="click1(this)" type="button" value="9"></td>
		<td><input onClick="click1(this)" type="button" value="0"></td>
		<td><input onClick="op(this)" type="button" value="+"></td>
		<td><input onClick="op(this)" type="button" value="-"></td>
	</tr>
	<tr>
		<td><input onClick="op(this)" type="button" value="*"></td>
		<td><input onClick="op(this)" type="button" value="/"></td>
		<td><input onClick="calca(this)" type="button" value="="></td>
		<td></td>
	</tr>
	
</table>

</body>
</html>

效果：

iris w

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2017-11-28 clac 简易计算器

使用js写的简易计算器使用到了innerHTML，数据的转换parseInt无标题文档 //x表示第一个运算数据，y表示第二个运算数据 var x = 0, y = 0; var calc = "";function get() { var obj = document.getElementById("user"); //根据ID获取某个标签对象
复制链接

扫一扫

专栏目录