`

jsp+javascrip的简单运算器

阅读更多
<body>
        <input type="text" name="num1" id="num1">
        <input type="radio" name="radio1" value="radio1" checked="checked">
        +
        <input type="radio" name="radio1" value="radio2">
        -
        <input type="text" name="num2" id="num2">
        =
        <input type="text" name="num3" id="num3">
        <input type="button" name="button1" id="button2" value="运算"
            onclick="operation()">

    </body>
文本显示后如下图
+ - =
 
点运算后显示如下图
+ - =


<script type="text/javascript">
    function operation() {
         //获取填入表单的数值并转化成浮点数值;
        var num1 = parseFloat(document.getElementById("num1").value);
        var num2 = parseFloat(document.getElementById("num2").value);
        //获取num3的Id
        var num3 = document.getElementById("num3");
       //获取单选按钮的组的Id
        var radio = document.getElementsByName("radio1");
        var commend;
      //遍历单选按钮判断哪个按钮被选中
        for ( var i = 0; i < radio.length; i++) {
            if (radio[i].checked == true) {
                commend = radio[i].value;
                break;
            }
        }
      //判断填入的内容是否为数字
        if (num1 != null && num2 != null) {
           if (isNaN(num1) || isNaN(num2)) {
                if (isNaN(num1)) {
                    alert("第一个输入框输入的不是数字或者没有输入数值");
                } else {
                    alert("第二个输入框输入的不是数字或者没有输入数值");
                }
//判断选中的单选框的属性,
            } else if (commend == "radio1") {
                var num4 = num1 + num2;
                num3.value = num4;
            } else if (commend == "radio2") {
                var num4 = num1 - num2;
                num3.value = num4;
            }
        }
    }
</script>

分享到:
评论

相关推荐

    jsp+java留言板

    【jsp+java留言板】是一个基于Java Web技术实现的简单在线交流平台,主要使用JSP(JavaServer Pages)作为视图层,结合Java后端处理数据,实现用户留言、查看留言的功能。这个实训项目旨在帮助学习者掌握Web开发的...

    精通正则表达式基于.NET ASP PHP JSP JavaScript

    JSPExample5.jsp JSP页面中字符数据的简单使用 JSPExample6.jsp 结合布尔类型变量判断学生成绩等级 JSPExample7.jsp text.html页面提交至该页,并显示提交数据 text.html 页面数据提交至...

    大学生jsp+css网页精品作业系列17

    JSP文件在服务器端被编译为Servlet,然后发送到客户端,使得服务器端的处理能力得以利用,比如数据库交互、逻辑运算等。 **CSS(Cascading Style Sheets)** 是用于描述网页及应用程序用户界面外观和表现的样式表...

    企业人事管理系统(jsp+servlet).zip

    在本系统中,模型可能是数据访问对象(DAO)和业务逻辑组件,视图由jsp页面构成,而servlet扮演控制器的角色。 3. **数据库设计**:系统需要一个数据库来存储员工信息、部门信息、职位信息等。可能包括员工表...

    JSP简单的计算器

    在本项目中,"JSP简单的计算器"是一个基于JAVA WEB技术实现的简易计算工具,主要目的是让学生或开发者熟悉JSP(JavaServer Pages)的基本用法和动态网页开发。以下是关于这个项目的详细知识点: 1. **JSP基础**: ...

    韩顺平JSP学习笔记+源代码

    下面是一个简单的JSP示例,展示了如何在JSP页面中嵌入Java代码: ```jsp ;charset=gb2312" %&gt; &lt;h1&gt;jsp1 int a = 0; int b = 9; int c = a + b; out.println("hello, world!, 世界你好!" + c); %&gt; ``` #### ...

    jsp-计算器

    通过这个简单的项目,开发者可以学习到JSP的基本语法、JavaScript的前端交互以及如何结合两者实现一个动态Web应用。此外,还可以了解到如何处理用户输入、进行错误检查以及如何在Web环境中返回动态生成的内容。对于...

    JSP速成教程(很好的学习JSP的教程)

    5. **EL(Expression Language)**:EL是一种轻量级的表达式语言,用于在JSP页面中获取和设置JavaBean的属性,以及执行基本的算术和逻辑运算。 6. **JSTL(JavaServer Pages Standard Tag Library)**:JSTL是一套...

    计算器实现四则运算

    在这个“计算器实现四则运算”的项目中,我们聚焦于使用JSP(JavaServer Pages)技术来实现这一功能。JSP是Java平台上用于创建动态网页的一种技术,它结合了HTML和Java代码,使得开发者可以方便地处理服务器端的业务...

    JavaScript完全自学宝典 源代码

    示例描述:演示JavaScript的简单应用及JavaScript特效。 1.1.html 用JavaScript开发的弹出式“Hello World”实例。 1.2.html 在页面中输出的“Hello World”。 1.3.html 使用JavaScript进行文本框值的...

    mvc模式jsp计算器

    总的来说,"mvc模式jsp计算器"是一个很好的学习实例,它演示了如何使用MVC模式来构建一个简单的Web应用,同时利用JSP技术实现了用户友好的界面交互。理解这个例子有助于提升对Web开发架构和设计模式的理解。

    jsp的倒计时模块的实现

    这里使用了`Date`对象获取当前时间和目标时间,并通过简单的算术运算计算出时间差。根据时间差的大小,输出剩余天数或提示已经超过了目标日期。 **第二段代码**: ```javascript function show_student163_time() {...

    jsp_2.1_api

    1. **表达式语言(EL)增强**:JSP 2.1引入了EL 2.1,增强了表达式语言的功能,支持更复杂的逻辑运算和类型转换,使得在JSP页面中处理数据更加简洁。 2. **统一的标签库(Tag Library)**:JSP 2.1规范统一了自定义...

    javascript实现的网页拾色器

    JavaScript提供了丰富的数学运算,我们可以编写函数来完成这些转换。 5. **用户界面更新**:一旦获取到颜色,我们需要将其显示在界面上,这可能包括色块的填充、颜色代码的显示等。这需要对DOM(文档对象模型)有...

    ajax实现的简单计算器

    【Ajax实现的简单计算器】 Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这种技术使得用户可以与网页进行更流畅、更快捷的交互,提高了用户体验。在这...

    jsp运用与开发技术 源代码

    3. **EL(Expression Language)**:EL是JSP 2.0引入的一种简洁的表达式语言,用于从作用域(如page, request, session, application)中获取和设置对象的属性,或者进行简单的算术和逻辑运算。 4. **JSTL(Java...

    韩顺平javascript课堂笔记完整版

    - 尽管简单的JavaScript编写可以用记事本完成,但更复杂的开发通常使用IDE,如MyEclipse,现在的Web开发者更倾向于使用Visual Studio Code、Sublime Text或WebStorm等专业编辑器。 4. **案例分析**: - 案例1展示...

    在jsp页面中的日期选择框

    这个简单的HTML代码会在浏览器支持的情况下显示一个日期选择器。然而,不是所有浏览器都支持HTML5的日期输入类型,尤其是较老的版本和某些非主流浏览器。因此,通常需要使用JavaScript库来提供更广泛的兼容性。 ...

    JSP编程技术(免積分)

    在此案例中,当尝试执行除法运算且除数为零时,将抛出异常,并跳转到指定的错误处理页面`4-03.jsp`。 #### 三、JSP的六大基本对象 JSP提供了六个内置对象,它们分别是: 1. **out对象**: 用于向客户端输出数据。 ...

    JSP月历时间源代码

    【JSP月历时间源代码】是一个典型的Java服务器页面(JSP)开发示例,它提供了展示日期和时间,特别是包含农历节日功能的功能。在Web应用程序中,这样的功能常常用于日程管理、事件提醒或者创建用户友好的界面。下面...

Global site tag (gtag.js) - Google Analytics