网页计算器简易js代码,网页计算器简易js代码

本文目录一览:

简易的加减乘除的计算器代码js

//html

input type=”text” id=”num1″ value=”” /

    select id=”mySelect”

        option value=”+”+/option

        option value=”-“-/option

        option value=”*”*/option

        option value=”/”//option

    /select

    input type=”text” id=”num2″ value=”” /

    input type=”button” id=”jisuan” value=”计算” /

//js

script

    var oTxt1 = document.getElementById(‘num1’);

    var oTxt2 = document.getElementById(‘num2’);

    var oSelect = document.getElementById(‘mySelect’);

    var oBtn = document.getElementById(‘jisuan’);

    oBtn.onclick=function(){

        switch(oSelect.value){

            case ‘+’:

                alert(parseInt(oTxt1.value)+parseInt(oTxt2.value));

                break;

            case ‘-‘:

                alert(parseInt(oTxt1.value)-parseInt(oTxt2.value));

                break;

            case ‘*’:

                alert(parseInt(oTxt1.value)*parseInt(oTxt2.value));

                break;

            case ‘/’:

                if(parseInt(oTxt2.value) !== 0){

                    alert(parseInt(oTxt1.value)/parseInt(oTxt2.value));

                }else{

                    alert(‘除数不能为0’);

                }

                

                break;

            default:

                alert(‘Bug!!!’);

        }

    }

/script

如何用js做一个简易计算器

js做一个简易计算器具体如下:

html

head

titlejs运算/title

boby

table

tr

td第一个数/td

tdinput type=”text” id=”onesum”/td

/tr

tr

td运算符号/td

tdinput type=”text” id=”fh”/td

/tr

tr

td第二个数/td

tdinput type=”text” id=”twosum”/td

/tr

tr

td计算结果/td

tdinput type=”text” id=”sum”/td

/tr

tr

td colspan=”2″input type=”button” value=”   计算   ” onclick=”js()”/td

/tr

table

script

function js(){

var num1=document.getElementById(“onesum”).value;

var num2=document.getElementById(“twosum”).value;

var fh=document.getElementById(“fh”).value;

var sum=0;

nu

m1=Number(num1);

num2=Number(num2);

if(fh==’+’)

{

sum=num1+num2;

}

else if(fh==’-‘)

{

sum=num1-num2;

}else if(fh==’*’)

{

sum=num1*num2;

}else if(fh==’/’)

{

sum=num1/num2;

}

//alert(sum);

document.getElementById(“sum”).value=sum;

}

/script

/boby

/html

JavaScript 教程 JavaScript 是属于网络的脚本语言! JavaScript 被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。

用js代码做一个简易计算器

function test(){

     var txt1 = document.getElementById(“txt1”),

         txt2 = document.getElementById(“txt2”),

         txt3 = document.getElementById(“txt3”),

         opt  = document.getElementById(“sel”);

     txt3.value =  eval(txt1.value + opt.value + txt2.value);//eval函数可计算某个字符串,并执行其中的的js代码

}

input type=”text” id=”txt1″ /

select id=”sel”

     option value=”+”+/option

     option value=”-“-/option

     option value=”*”*/option

     option value=”/”//option

/select

input type=”text” id=”txt2″ /

=

input type=”text” id=”txt3″ /

input type=”button” id=”btn” value=”计算” onclick=”test()”/

原创文章,作者:小蓝,如若转载,请注明出处:https://www.506064.com/n/258663.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
小蓝小蓝
上一篇 2024-12-15 12:50
下一篇 2024-12-15 12:50

相关推荐

  • Python周杰伦代码用法介绍

    本文将从多个方面对Python周杰伦代码进行详细的阐述。 一、代码介绍 from urllib.request import urlopen from bs4 import Bea…

    编程 2025-04-29
  • Python字符串宽度不限制怎么打代码

    本文将为大家详细介绍Python字符串宽度不限制时如何打代码的几个方面。 一、保持代码风格的统一 在Python字符串宽度不限制的情况下,我们可以写出很长很长的一行代码。但是,为了…

    编程 2025-04-29
  • Python基础代码用法介绍

    本文将从多个方面对Python基础代码进行解析和详细阐述,力求让读者深刻理解Python基础代码。通过本文的学习,相信大家对Python的学习和应用会更加轻松和高效。 一、变量和数…

    编程 2025-04-29
  • Python满天星代码:让编程变得更加简单

    本文将从多个方面详细阐述Python满天星代码,为大家介绍它的优点以及如何在编程中使用。无论是刚刚接触编程还是资深程序员,都能从中获得一定的收获。 一、简介 Python满天星代码…

    编程 2025-04-29
  • 仓库管理系统代码设计Python

    这篇文章将详细探讨如何设计一个基于Python的仓库管理系统。 一、基本需求 在着手设计之前,我们首先需要确定仓库管理系统的基本需求。 我们可以将需求分为以下几个方面: 1、库存管…

    编程 2025-04-29
  • 写代码新手教程

    本文将从语言选择、学习方法、编码规范以及常见问题解答等多个方面,为编程新手提供实用、简明的教程。 一、语言选择 作为编程新手,选择一门编程语言是很关键的一步。以下是几个有代表性的编…

    编程 2025-04-29
  • Python实现简易心形代码

    在这个文章中,我们将会介绍如何用Python语言编写一个非常简单的代码来生成一个心形图案。我们将会从安装Python开始介绍,逐步深入了解如何实现这一任务。 一、安装Python …

    编程 2025-04-29
  • 怎么写不影响Python运行的长段代码

    在Python编程的过程中,我们不可避免地需要编写一些长段代码,包括函数、类、复杂的控制语句等等。在编写这些代码时,我们需要考虑代码可读性、易用性以及对Python运行性能的影响。…

    编程 2025-04-29
  • 北化教务管理系统介绍及开发代码示例

    本文将从多个方面对北化教务管理系统进行介绍及开发代码示例,帮助开发者更好地理解和应用该系统。 一、项目介绍 北化教务管理系统是一款针对高校学生和教职工的综合信息管理系统。系统实现的…

    编程 2025-04-29
  • Python爱心代码动态

    本文将从多个方面详细阐述Python爱心代码动态,包括实现基本原理、应用场景、代码示例等。 一、实现基本原理 Python爱心代码动态使用turtle模块实现。在绘制一个心形的基础…

    编程 2025-04-29

发表回复

登录后才能评论