javascript的一个网页按钮代码

发布网友发布时间：2022-04-21 23:07

共4个回答

热心网友时间：2022-04-22 00:37

<!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.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>功、能和热量单位计量单位换算器</title>

<style>

input{border:1px solid #ccc;padding:4px 8px;}

input.cz,input.hs{background:#f1f1f1;}

</style>

</head>

<body style="font-size:12px;">

<div align="center">

<div id="result">

<table width="600" cellpadding=2 cellspacing=0 style="font-size:12px;">

<tr><td>

<script language="javascript" type="text/javascript">

function HEAT_MEASURES() {

this.Joule = 1

this.Kgm = 0.08598452278

this.Psh = 60.2409638554

this.Hph = 85.98452278

this.Kwh = 3599712.023038157

this.Kcal = 4185.851820846

this.Btu = 1055.0749103

this.Ftlb = 1.3557483731

}

var heat_data = new HEAT_MEASURES();

function checkNum(str) {

for (var i=0; i<str.length; i++) {

var ch = str.substring(i, i + 1)

if (ch!="." && ch!="+" && ch!="-" && ch!="e" && ch!="E" && (ch < "0" || ch > "9")) {

alert("请输入有效的数字");

return false;

}

}

return true

}

function normalize(what,digits) {

var str=""+what;

var pp=Math.max(str.lastIndexOf("+"),str.lastIndexOf("-"));

var idot=str.indexOf(".");

if (idot>=1) {

var ee=(pp>0)?str.substring(pp-1,str.length):"";

digits+=idot;

if (digits>=str.length)

return str;

if (pp>0 && digits>=pp)

digits-=pp;

var c=eval(str.charAt(digits));

var ipos=digits-1;

if (c>=5) {

while (str.charAt(ipos)=="9")

ipos--;

if (str.charAt(ipos)==".") {

var nc=eval(str.substring(0,idot))+1;

if (nc==10 && ee.length>0) {

nc=1;

ee="e"+(eval(ee.substring(1,ee.length))+1);

}

return ""+nc+ee;

}

return str.substring(0,ipos)+(eval(str.charAt(ipos))+1)+ee;

}

else

var ret=str.substring(0,digits)+ee;

for (var i=0; i<ret.length; i++)

if (ret.charAt(i)>"0" && ret.charAt(i)<="9")

return ret;

return str;

}

return str;

}

function compute(obj,val,data) {

if (obj[val].value) {

var uval=0;

uval = obj[val].value*data[val];

if( (uval >= 0) && (obj[val].value.indexOf("-") != -1) ) {

uval = -uval;

}

for (var i in data)

obj[i].value=normalize(uval/data[i],3);

}

}

function resetValues(form,data) {

for (var i in data)

form[i].value="";

}

function resetAll(form) {

resetValues(form,heat_data);

}

</script>

<table class="tb" cellpadding="4" cellspacing="5" width=500 align="center">

<tbody>

<form action="" id="dwhsfrom">

<tr height=10><td colspan=6><p style="text-align:center;font-size:16px;font-weight:bold;">单位换算</p></td></tr>

<tr>

<td align=right nowrap>万大卡(10<sup>4</sup>kal)</td>

<td align=left><input name=Joule size="12" id="Joule"></td>

<td align=left><input class="hs" onClick="if (checkNum(Joule.value)) compute(this.form,Joule.name,heat_data)" type=button value="换算" name=Joule_bt></td>

<td align=right nowrap>千瓦(kw)</td>

<td align=left><input name=Kgm size="12"></td>

<td align=left><input class="hs" onClick="if (checkNum(Kgm.value)) compute(this.form,Kgm.name,heat_data)" type=button value="换算" name=Kgm_bt></td>

</tr>

<tr>

<td align=right nowrap>吨蒸发量</td>

<td align=left><input name=Psh size="12"></td>

<td align=left><input class="hs" onClick="if (checkNum(Psh.value)) compute(this.form,Psh.name,heat_data)" type=button value="换算" name=Psh_bt></td>

<td align=right nowrap>兆瓦（mw）</td>

<td align=left><input name=Hph size="12"></td>

<td align=left><input class="hs" onClick="if (checkNum(Hph.value)) compute(this.form,Hph.name,heat_data)" type=button value="换算" name=Hph_bt></td>

</tr>

<tr height=10><td colspan=6><hr style="border-style: dotted;margin-top:30px;" color=#cccccc size=1 /></td></tr>

<tr>

<td align=center colspan=6><input class="cz" type=button value="数据换算" onclick="dodoStartProcessIt()"> <input class="cz" onClick=resetAll(this.form) type=button value="重置" name=res7></td>

</tr>

</form>

</tbody>

</table>

</td></tr></table>
<script type="text/javascript">

</script>
</body>

</html>

热心网友时间：2022-04-22 01:55

楼上的测试了吗？你写的不能用，点击报错

我写了个，在LZ原来的基础上增加了一处，改动了一处：

1.将<INPUT class=cz type=button value=数据换算>这个按钮家onclick事件，
改为<INPUT class=cz type=button value=数据换算 onClick="chhs(this.form,Joule,Kgm,Psh,Hph)">

2.在js中加chhs方法：
function chhs(obj,o1,o2,o3,o4) {
if(checkNum(o1.value))
compute(obj,o1.name,heat_data);
if(checkNum(o2.value))
compute(obj,o2.name,heat_data);
if(checkNum(o3.value))
compute(obj,o3.name,heat_data);
if(checkNum(o4.value))
compute(obj,o4.name,heat_data);
}
这样就OK了，经测试可用，自认为已经是最简洁的方案，但不是最完美，因为计算一次后如果想计算第二次就必须把数据先清空，所以仅供LZ参考。
LZ原文中还有报错，大概是for循环引起的，但是不影响功能使用。

热心网友时间：2022-04-22 03:29

没看清题目，后面的继续

热心网友时间：2022-04-22 05:21

具体代码就不写啦，有个笨方法，判断四个文本框，判断一下如果第一个不为空剩下的全为空，则执行第一个function 下面的类似，你可以试试，你明白的话我们可以再交流一下