一起添加TextBox的值 [英] Adding Values of TextBoxes Together

查看:79
本文介绍了一起添加TextBox的值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的表单上有4个TextBox,我正在尝试添加一个

总计。这是我正在使用的代码:


< SCRIPT LANGUAGE =" JavaScript">

<! - JavaScript的开头 -


函数calcTotalPub()

{

var tempFed = + document.Form1 [''txtFedSup'']。value;

变种tempState = + document.Form1 [ '' txtStateSup '']值;

变种tempCounty = + document.Form1 [ '' txtStateSup '']的值。

var tempCity = + document.Form1 [''txtCitySup'']。value;


document.Form1 [''txtTotalPub'']。value = tempFed + tempState +

tempCounty + tempCity;

}


// - JavaScript结束 - - >

< / SCRIPT>


在我的txtFedSup TextBox中键入一个值并点击它之后,

我收到了以下错误消息:

'document.Form1.txtFedSup.value''为空或不是对象


我输入了一个数字进入txtFedSup fi我和我还将

数字零作为默认值键入到重映射的TextBox中,但

我仍​​然收到此空错误消息。


谁能告诉我我做错了什么?我不是很有经验

with JavaScripts。


谢谢,

CR Junk

解决方案

crjunk写道:

我的表单上有4个TextBox,我正在尝试将它们添加到一起来获取
总计。这是我正在使用的代码:

< SCRIPT LANGUAGE =" JavaScript">
<! - JavaScript的开头 -

function calcTotalPub()
{var tempFed = + document.Form1 [''txtFedSup'']。value;


如果使用怎么办:Number(document.Form1 [''txtFedSup'']。value)?

这是对文本字段的正确引用?

Mick


var tempState = + document.Form1 [''txtStateSup'']。value;
var tempCounty = + document.Form1 [''txtStateSup'']。value;
var tempCity = + document.Form1 [''txtCitySup'']。value;

document.Form1 [''txtTotalPub'']。 value = tempFed + tempState +
tempCounty + tempCity;
}
// - JavaScript结尾 - - >
< / SCRIPT>


crjunk写道:

我的表单上有4个TextBox,我正在尝试将它们添加到一起
总计。这是我正在使用的代码:


< snip>

谁能告诉我我做错了什么?我对JavaScripts不是很有经验。

谢谢,
CR Junk



您的代码有一些严重的问题。从顶部开始:

< SCRIPT LANGUAGE =" JavaScript">


使用:


< script type =" text / javascript">

var tempFed = + document.Form1 [ '' txtFedSup '']的值。


我认为你创建了一个id =" Form1"的表格。您使用的语法仅适用于IE,即使用元素IDForm1。作为全球变量。 +表示+。不应该在那里 - 我不知道你想用它实现什么。


你有两个同名的文本框:

var tempCounty = + document.Form1 [''txtStateSup'']。value;




所以按名称引用它们会产生不可预测的结果(很可能是失败的)。我已经更改了其中一个的名称 - 除非你真的想要两次添加相同的值,否则你只想打一个电话。


你可以得到一个使用ID对表格的引用如下:


var theTable = document.getElementById(''Form1'');


或者你可以使用表格的名称如下(假设你已经使名称=Form1):


var tempFed = document.forms [''Form1'']。 [''txtFedSup'']。值;


更好的是,当用户点击添加'em'时按钮,你可以简单地使用:


onclick =" calcTotalPub(this.form);"


将引用传递给calc函数的当前形式 - 不需要id或name。这意味着你的calc函数更抽象。更进一步,您可以找到表单中的所有文本框并添加它们,而不是通过名称明确查找每个值,但我会把它留给您。


你还必须在添加之前将字符串转换为数字,否则将获得字符串连接。请阅读:

http://www.jibbering。 com / faq / #FAQ4_21


您可能希望添加格式以保证两个小数位而不是整数。此外,添加验证以确保输入了适当的文本 - 如果使用下面的代码输入了数字以外的其他内容,则会产生错误。最后,你应该考虑禁用总盒子,这样用户就不能在那里放任何他们想要的东西 - 除非你希望他们能够。


下面是类似于你的代码这将起作用:


<!DOCTYPE HTML PUBLIC" - // W3C // DTD HTML 4.0 Transitional // EN">

< html>

< head>

< title>添加em< / title>

< meta name =" description" content ="添加表单内容"

< / head>

< body>

< script type ="文本/ JavaScript的">

功能calcTotalPub(theForm){

变种tempFed = theForm.elements [ '' txtFedSup '']值;

VAR tempState = theForm.elements [ '' txtStateSup '']值;

变种tempCounty = theForm.elements [ '' txtStateSupA '']值;

VAR tempCity = theForm.elements [ '' txtCitySup '']值;


theForm.elements [ '' txtTotalPub '']值=号码(tempFed)
$。 b $ b + Number(tempState)

+ Number(tempCounty)

+ Number(tempCity);

}

< / script>

< / head>

< body>

< h2>这是表格< / h2>

< form name =" Form1">

< input type =" text" name =" txtFedSup"> txtFedSup< br>

< input type =" text" name =" txtStateSup"> txtStateSup< br>

< input type =" text" name =" txtStateSupA"> txtStateSupA< br>

< input type =" text" name =" txtCitySup"> txtCitySup< br>

< input type =" text"名称= QUOT; txtTotalPub" value =" - "> txtTotalPub< br>

< input type =" button" value ="添加''em"

onclick =" calcTotalPub(this.form);">< br>

< input type =" ;重置" onclick =" reset();">

< / form>

< / body>

< / html> ;




" crjunk" < CR **** @ earthlink.net>在消息中写道

新闻:e4 ************************** @ posting.google.c om ...

我的表单上有4个TextBox,我正在尝试将它们加在一起以获得
总计。这是我正在使用的代码:

< SCRIPT LANGUAGE =" JavaScript">
<! - JavaScript的开头 -

function calcTotalPub()
{var tempFed = + document.Form1 [''txtFedSup'']。value;
============================================

******************************************** ******

应该是

var tempFed + = document.forms [0] .element [0] .value

??

**************************************** **********

================================ ============= var tempState = + document.Form1 [''txtStateSup'']。value;
var tempCounty = + document.Form1 [''txtStateSup'']。value ;
变种tempCity = + document.Form1 [ '' txtCitySup '']值;

document.Form1 [ '' txtTotalPub '']值= tempFed + tempState +
tempCounty + tempCity;
}
// - JavaScript结束 - >
< / SCRIPT>

输入后我的txtFedSup TextBox中的一个值,然后单击它,
我收到以下错误消息:"
''document.Form1.txtFedSup.value''为null或不是对象

我在txt中输入了一个数字FedSup字段和我也将
数字零作为默认值输入到重映射的TextBox中,但是我仍然收到这个空的错误信息。

任何人都可以告诉我,我做错了什么?我对JavaScripts不是很有经验。

谢谢,
CR Junk



---

发送邮件经过无病毒认证。

由AVG反病毒系统检查( http://www.grisoft.com)

版本:6.0.754 /病毒库:504 - 发布日期:2004年9月6日


I have 4 TextBoxes on my form that I''m trying to add together to get a
grand total. Here is the code I''m using:

<SCRIPT LANGUAGE="JavaScript">
<!-- Beginning of JavaScript -

function calcTotalPub()
{
var tempFed = +document.Form1[''txtFedSup''].value;
var tempState = +document.Form1[''txtStateSup''].value;
var tempCounty = +document.Form1[''txtStateSup''].value;
var tempCity = +document.Form1[''txtCitySup''].value;

document.Form1[''txtTotalPub''].value = tempFed + tempState +
tempCounty + tempCity ;
}

// - End of JavaScript - -->
</SCRIPT>

After I type in a value into my txtFedSup TextBox and click out of it,
I receive the following error message: "
''document.Form1.txtFedSup.value'' is null or not an object "

I have a number typed into the txtFedSup field and I also have the
number zero typed into the remaing TextBoxes as a default value, but
I''m still receiving this null error message.

Can anyone tell me what I''m doing wrong? I''m not very experienced
with JavaScripts.

Thanks,
C.R. Junk

解决方案

crjunk wrote:

I have 4 TextBoxes on my form that I''m trying to add together to get a
grand total. Here is the code I''m using:

<SCRIPT LANGUAGE="JavaScript">
<!-- Beginning of JavaScript -

function calcTotalPub()
{
var tempFed = +document.Form1[''txtFedSup''].value;
What if you use: Number(document.Form1[''txtFedSup''].value) ?
And is that a correct reference to the textfield?
Mick

var tempState = +document.Form1[''txtStateSup''].value;
var tempCounty = +document.Form1[''txtStateSup''].value;
var tempCity = +document.Form1[''txtCitySup''].value;

document.Form1[''txtTotalPub''].value = tempFed + tempState +
tempCounty + tempCity ;
}

// - End of JavaScript - -->
</SCRIPT>



crjunk wrote:

I have 4 TextBoxes on my form that I''m trying to add together to get a
grand total. Here is the code I''m using:
<snip>
Can anyone tell me what I''m doing wrong? I''m not very experienced
with JavaScripts.

Thanks,
C.R. Junk

Your code has some serious issues. Taking it from the top:
<SCRIPT LANGUAGE="JavaScript">
Use:

<script type="text/javascript">
var tempFed = +document.Form1[''txtFedSup''].value;
I presume you have created a form with id="Form1". The syntax you''ve used only works in IE, that is, using the element ID "Form1" as a global variable. The "+" should not be there - I don''t know what you are trying to achieve with it.

You have calls to two text boxes with the same name:
var tempCounty = +document.Form1[''txtStateSup''].value;



so referencing them by name will give unpredictable results (most likely failure). I''ve changed the name of one of them - unless you really want to add the same value twice, or you only meant to have one of the calls.

You can get a reference to the table using the ID as follows:

var theTable = document.getElementById(''Form1'');

Or you can use the name of the form as follows (presuming you have made the name="Form1"):

var tempFed = document.forms[''Form1''].elements[''txtFedSup''].value;

Even better, when the user clicks on the "add ''em" button, you can simply use:

onclick="calcTotalPub(this.form);"

to pass a reference to the current form to the calc function - no need for id or name. It means your calc function is more abstracted. Going further, you could just find all the text boxes in your form and add them, rather than explicitly finding each value by name but I''ll leave that up to you.

You also must convert your strings to numbers before adding, otherwise you will get string concatenation. Read here:

http://www.jibbering.com/faq/#FAQ4_21

You may want to add formatting to guarantee two decimal places rather than integers. Also, add validation to ensure appropriate text has been entered - if something other than a number is entered using the code below, an error will result. Lastly, you should consider disabling the total box so users can''t just put whatever they want in there - unless you want them to be able to.

Below is code similar to yours that will work:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> add em </title>
<meta name="description" content="Adds form content">
</head>
<body>
<script type="text/javascript">
function calcTotalPub(theForm){
var tempFed = theForm.elements[''txtFedSup''].value;
var tempState = theForm.elements[''txtStateSup''].value;
var tempCounty = theForm.elements[''txtStateSupA''].value;
var tempCity = theForm.elements[''txtCitySup''].value;

theForm.elements[''txtTotalPub''].value = Number(tempFed)
+ Number(tempState)
+ Number(tempCounty)
+ Number(tempCity);
}
</script>
</head>
<body>
<h2>Here is the form</h2>
<form name="Form1">
<input type="text" name="txtFedSup">txtFedSup<br>
<input type="text" name="txtStateSup">txtStateSup<br>
<input type="text" name="txtStateSupA">txtStateSupA<br>
<input type="text" name="txtCitySup">txtCitySup<br>
<input type="text" name="txtTotalPub" value="--">txtTotalPub<br>
<input type="button" value="Add ''em"
onclick="calcTotalPub(this.form);"><br>
<input type="reset" onclick="reset();">
</form>
</body>
</html>



"crjunk" <cr****@earthlink.net> wrote in message
news:e4**************************@posting.google.c om...

I have 4 TextBoxes on my form that I''m trying to add together to get a
grand total. Here is the code I''m using:

<SCRIPT LANGUAGE="JavaScript">
<!-- Beginning of JavaScript -

function calcTotalPub()
{
var tempFed = +document.Form1[''txtFedSup''].value; ============================================
**************************************************
Should that be
var tempFed += document.forms[0].element[0].value
??
**************************************************
============================================= var tempState = +document.Form1[''txtStateSup''].value;
var tempCounty = +document.Form1[''txtStateSup''].value;
var tempCity = +document.Form1[''txtCitySup''].value;

document.Form1[''txtTotalPub''].value = tempFed + tempState +
tempCounty + tempCity ;
}

// - End of JavaScript - -->
</SCRIPT>

After I type in a value into my txtFedSup TextBox and click out of it,
I receive the following error message: "
''document.Form1.txtFedSup.value'' is null or not an object "

I have a number typed into the txtFedSup field and I also have the
number zero typed into the remaing TextBoxes as a default value, but
I''m still receiving this null error message.

Can anyone tell me what I''m doing wrong? I''m not very experienced
with JavaScripts.

Thanks,
C.R. Junk


---
Outgoing mail is certified Virus Free.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.754 / Virus Database: 504 - Release Date: 9/6/2004


这篇关于一起添加TextBox的值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆