HTML表格中的JavaScript计算

我是JavaScript的新手,所以我甚至不知道这是否是尝试这个的正确语言,但我想我会尝试.我已经阅读了其他几篇文章,我找不到真正让我知道如何做到这一点的东西,所以我在这里问.我读过的所有例子都涉及用户输入的数字和/或选择.但是,我要采用静态的计算方法.我在HTML中输入信息到表中,JavaScript计算信息并将信息输出到表格中的单元格.这是我到目前为止的表格所拥有的代码(我知道它不是编码它的最佳方式,我正在努力,我刚刚遇到了这个绊脚石):

<table>
<tr><td><font size="2"><strong>Retail Price:</strong></font></td>
<td name = "retailPrice" id="retailPrice"><font size="2"><del>$97.97</del></font></td></tr>

<tr><td><font size="2"><strong>Sale Price:</strong></font></td>
<td><font size="2"><del>$89.97</del></font></td></tr>

<tr><td><font size="3"><strong>Our Price:</strong></font></td>
<td name = "ourPrice" id="ourPrice"><font size="3" color="Red">$79.97</font></td></tr>
<tr><td><font size="2"><strong>You Save:</strong></font></td>
<td name = "yourSavings"><font font size="2" color="Red"></font></td></tr></table>

这是我能想到的唯一一个javascript:

<script type="text/javascript" >
$(function(){
var add = parseInt($("#retailPrice").val()) + parseInt($("#ourPrice").val());
$("yourSavings").html(add);
}).keyup();
</script>

我知道我可能真的错了,但我想在寻求帮助之前我会尝试一些工作.基本上我需要脚本获取单元格“ourPrice”中的值并将其除以单元格“retailPrice”中的值,然后从“1”中减去总数以得到保存的百分比,然后将其输出到名为“yourSavings”的单元格中”.我希望这是有道理的.所以基本上它的工作原理如下:

(1-(ourPrice/retailPrice))

很感谢任何形式的帮助.

解决方法:

val方法用于表单元素,您希望使用text从表格单元格中提取原始文本.然后你必须通过删除非数字前缀的东西把它变成数字解析器会理解的东西:

function money_to_number(raw) {
    return parseFloat(raw.replace(/.*\$/, ''));
}

另请注意,在处理非整数值时,您需要parseFloat而不是parseInt.而你想减去而不是增加以节省开支.

您还需要在您定位的单元格上使用ID,您正在使用的选择器正在寻找< yourSavings>元素并没有这样的事情:

<td name = "yourSavings" id="yourSavings">
    <font font size="2" color="Red">
    </font>
</td>

你要选择< font>在里面:

$("#yourSavings font").html(savings);

所以,你的最终JavaScript应该是这样的:

function money_to_number(raw) {
    return parseFloat(raw.replace(/.*\$/, ''));
}

var retail  = money_to_number($('#retailPrice').text());
var ours    = money_to_number($('#ourPrice').text());
var savings = retail - ours;
$("#yourSavings font").html(savings);

格式化节省并将其转换为百分比是留给读者的练习.

一个现实的例子:http://jsfiddle.net/ambiguous/bn7Wg/

上一篇:c# – Microsoft标准计算器中使用的变量类型


下一篇:C/C++的URL路由库,R3Router初探