4月10日 RIA 周二

最新推荐文章于 2024-06-21 09:34:49 发布

原创最新推荐文章于 2024-06-21 09:34:49 发布 · 127 阅读

0 ·

CC 4.0 BY-SA版权

2018 专栏收录该内容

337 篇文章

订阅专栏

本文介绍了一个简单的网页版计算器实现方法，使用HTML和JavaScript构建用户界面并完成基本的算术运算功能。

这里写图片描述

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">

    <title>My JSP 'one.jsp' starting page</title>

    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script type="text/javascript">
        //函数
        function go(){
            //获取表单的值
            var d1 = document.getElementById("d1");
            var d2 = document.getElementById("d2");
            var d3 = document.getElementById("d3");
            //赋值
            var vald1 = d1.value;
            var vald2 = d2.value;
            var vald3 = d3.value;
            //组合
            var result = vald1+vald2+vald3;
            //转换字符串为可运算的值
            var res = eval(result);
            //将结果赋给文本框
            d4.value = res;
        }
    </script>
  </head>

  <body>
    <center>
    <h1>简易计算机</h1>
        值1:<input type="text" id="d1">
        <select id="d2">
            <option value="+">+</option>
            <option value="-">-</option>
            <option value="*">*</option>
            <option value="/">/</option>
        </select>
        值2:<input type="text" id="d3">
        <input type="button" value="计算" onclick="go()">
        结果:<input type="text" id="d4">
    </center>
  </body>
</html>