[java代码库]-简易计算器(第一种)_html/css_WEB-ITnose

WBOY
풀어 주다: 2016-06-24 12:02:13
원래의
1360명이 탐색했습니다.

简易计算器(效果如图所示)

  第一种方案:采用Javascript+html完成计算器,支持+-*/,结果显示不允许使用input输入域(可以考虑使用《span》)

 

<html>	<head>		<title>简易计算器</title>		<script language="javascript">//易错:不是"text/javascript"			function doCal(){				//alert(document.getElementByName("value1").length);//易错:getElementByName,首字母大写,不是byName				//alert(document.getElementByName("value1")[0].value);//易错:getElementByName,返回一个集合,应该用[0]表示需要获得第几个元素				var value1=parseInt(document.getElementById("value1").value);//易错:易错:getElementById首字母大写,不是byId								var flag=document.getElementById("flag").value;				var value2=parseInt(document.getElementById("value2").value);//易错:getElementBy返回是String类型,应该通过parseInt转换为Int类型				//alert(value1+","+flag+","+value2);//多打印东西出来,用于检验				var s=0;				switch(flag){					case "+"://易错:语法,别忘记加冒号						s=value1+value2;						break;//易错:语法,别忘记加break;跳出选择					case "-":						s=value1-value2;						break;					case "*":						s=value1*value2;						break;					case "/":						s=value1/value2;				}				//使运算结果显示在浏览器中,注意=右侧为string类型				document.getElementById("span_result").innerHTML="<font size='16' color='red'>"+s+"</font>"			}									//alert(document.getElementByName(value1).value);				</script>	</head>	<body>		<h1>简易计算器</h1>		<hr>		<input type="text" name="value1" id="value1">		<select name="flag" id="flag">//注意select-option的用法			<option value="+">+</option>			<option value="-">-</option>			<option value="*">*</option>			<option value="/">/</option>		</select>				<input type="text" name="value2" id="value2">		<!--		<button type="button" onclick="doCal()">点击这里</button>		-->		<input type="button" value="=" onclick="doCal()">//button的onclick事件		<!--		<input type="text" name="result" id="result">		-->		<span id="span_result"></span>//通过span显示结果	</body></html>
로그인 후 복사

  

 

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!