javascript-这是一个除法代码,我想实现自动运算,而不是输入信息后才运算,如何修改?

问题描述

这是一个除法代码,我想实现自动运算,而不是输入信息后才运算,如何修改?

是输入信息后点击input外边的范围才会运算,但是目前已经有信息,如何省却上述步骤直接运算?

 <html>
<head>
<script>
function compute()
{
  var a,b;
  if(document.getElementById("txt1").value!="" && document.getElementById("txt2").value!="")
 {
  a=parseFloat(document.getElementById("txt1").value);
  b=parseFloat(document.getElementById("txt2").value);
  document.getElementById("txt3").value=(a/b).toFixed(2);
 }
}
</script>
</head>
<body>
<input onchange="compute()" value="123123"  id="txt1">
<input onchange="compute()" value="123123"  id="txt2">
<input id="txt3" readonly>
</body>
</html>

解决方案

两个地方改一下,把onchange改成oninput,另外加一个onload事件,初始化txt3的值,这样就可以同时满足:初始值和自动运算,请看demo

 <html>
<head>
<script type='text/javascript'>
onload=function(){
    var a=parseFloat(document.getElementById("txt1").value),
    b=parseFloat(document.getElementById("txt2").value);
    document.getElementById("txt3").value=(a/b).toFixed(2);
}

function compute(){
    a=parseFloat(document.getElementById("txt1").value);
    b=parseFloat(document.getElementById("txt2").value);
    if(a!="" && b!=""){
        document.getElementById("txt3").value=(a/b).toFixed(2);
    }
}
</script>
</head>
<body>
<input oninput="compute()" value="123123"  id="txt1">
<input oninput="compute()" value="123123"  id="txt2">
<input id="txt3" readonly>

</body>
</html>

解决方案二:

优化一下

<html>
<head>
<script type='text/javascript'>
onload=compute;
function compute(){
    a=parseFloat(document.getElementById("txt1").value);
    b=parseFloat(document.getElementById("txt2").value);
    if(a!="" && b!=""){
        document.getElementById("txt3").value=(a/b).toFixed(2);
    }
}
</script>
</head>
<body>
<input oninput="compute()" value="123123"  id="txt1">
<input oninput="compute()" value="123123"  id="txt2">
<input id="txt3" readonly>

</body>
</html>

解决方案三:

在一个页面,没有操作怎么可以运算,我觉得你可以把结果的值写到下一个页面,然后用form表单提交一下,我不是很懂,同求解决办法。

时间: 2016-03-01

javascript-这是一个除法代码,我想实现自动运算,而不是输入信息后才运算,如何修改?的相关文章

css百度分享-请高手帮改一个CSS代码 让百度分享和文章链接并排

问题描述 请高手帮改一个CSS代码 让百度分享和文章链接并排 .Article-Tool{ border:1px solid #c3d4e7; position:relative; top:-1px; text-align:right; padding:8px; vertical-align:middle; height:15px; background-color:#f4f8fd} .Article-Tool a{width:16px;height:16px;line-height:16px;

Javascript中克隆一个数组的实现代码

 这篇文章主要是对在Javascript中克隆一个数组的实现代码进行了介绍.需要的朋友可以过来参考下,希望对大家有所帮助 08年一家公司JS面试题,职位是javascript工程师(赴google)   面试官问我如何克隆一个数组,当时想了下js的Object没有clone方法,java的Object有.   那怎么得到一个新数组呢?   我当时回答:用一个loop将源数组元素依次push到新数组中.这是最简单的方法,但显然不是面试官想要的答案.   最后告知我:利用Array的slice方法.

Javascript中克隆一个数组的实现代码_javascript技巧

08年一家公司JS面试题,职位是javascript工程师(赴google) 面试官问我如何克隆一个数组,当时想了下js的Object没有clone方法,java的Object有. 那怎么得到一个新数组呢? 我当时回答:用一个loop将源数组元素依次push到新数组中.这是最简单的方法,但显然不是面试官想要的答案. 最后告知我:利用Array的slice方法.示例如下: 复制代码 代码如下: var ary = [1,2,3];//源数组 var ary2 = ary.slice(0);//克隆

求代码 我想做一个网页效果,如下图。这个应该是用JS做的

问题描述 求代码 我想做一个网页效果,如下图.这个应该是用JS做的 就是那个 上标"新" 还有"9折"的那个 解决方案 所以用F12,它可以直接告诉你在哪个文件中. 解决方案二: 用层就可以实现,用IE F12看下css

我想做一个这样新用户注册界面,可是我不会把权限和姓名也写进数据库,求好心人赐一个完整代码

问题描述 我想做一个这样新用户注册界面,可是我不会把权限和姓名也写进数据库,求好心人赐一个完整代码 解决方案 看看这些http://download.csdn.net/detail/aimonhai/1480222http://download.csdn.net/download/bkzhw3/5975209http://download.csdn.net/download/fanhongwei601/4353841http://download.csdn.net/detail/qq223857

JavaScript 表单处理实现代码_基础知识

一 表单介绍 在HTML中,表单是由<form>元素来表示的,而在JavaScript中,表单对应的则是HTMLFormElement类型; // HTMLFormElement继承了HTMLElement;因此它拥有HTML元素具有的默认属性,别且还独有自己的属性和方法;HTMLFormElement属性和方法属性或方法 说明 acceptCharset 服务器能够处理的字符集; action 接受请求的URL; elements 表单中所有控件的集合; enctype 请求的编码类型; l

javascript中的一个小问题

问题描述 javascript中的一个小问题 function clickButton() { dynamicInsert(""dynamic.js""); show(); } <input type=""button"" value=""OK""> 这个是html界面中的一个按钮,点击的时候动态载入一段脚本 /***动态的插入一个脚本*/function dynamicIn

javascript实现简易计算器的代码_javascript技巧

今天闲来无聊,想写点什么,突然想到用javascript写一个计算器.程序还存在很多的Bug,先在这里记录一下,以后慢慢更正. 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.or

javascript数字验证的实例代码(推荐)_javascript技巧

现在有一个需求如下图: 产品经理说Card Number只能让输入数字(中间的空格是格式自加的,也是用js实现的),有时候我脑海中出现了个声音,啥玩意,加个type=number不就行了,事实发现图样图森破了,先不说type=number后面会有个上下标(虽然用css可干掉),但是这个类型是支持科学输入法的,就是小数点和e这样的是可以输入的,于是乎只能用其他的方式了,后来想用检索到输入了非数字就干掉,但是这样还是能输入,想法被打回,于是乎最终采用了键盘输入控制的办法,其实很简单, 代码如下: v