javascript帮助使用HTML和计算器

时间:2015-03-13 16:58:40

标签: javascript html onclick calculator

有人可以帮助我获得低于价格的股票总价吗?使用onclick,一旦有人输入他们想要购买的股票数量,我该如何选择所有3种股票的总价格?

    <tr>
        <td><b> SHARE PRICE</b></td>
        <td>$43.93</td>
        <td>$43.87</td>
        <td>$26.33</td>
    </tr>
</table> 
<hr>
<br>
<p>
<h3>Important information that you should know about these stocks: </h3>
<ul>
    <li>0.1% of the trade value if the total trade value is less than $10,000</li>
    <li>0.08% of the trade value if the total trade value is greater than or equal to $10,000</li>
    <li>The minimum commission is $5</li>
    <hr>
    <br>
</ul>  

<form name="calculator">

<p> Enter the number of Oracle Corporation stocks you wish to purchase!: <input type="text" id="input1"></p> <br>
<p> Enter the number of Microsoft Corporation stocks you wish to purchase!: <input type="text" id="input2"></p> <br>
<p> Enter the number of Symantec Corporation stocks you wish to purchase!: <input type="text" id="input3"></p> <br

1 个答案:

答案 0 :(得分:1)


我建议将价格信息存储为某个地方的数值,例如隐藏的输入字段或表格单元格中的data-属性,并在这些元素上创建ID,以便与库存购买的输入相关联。那么这只是做一些简单数学的问题。以下是使用隐藏输入的示例:

<table>
    <tr>
        <td><b> SHARE PRICE</b></td>
        <td>$43.93</td>
        <td>$43.87</td>
        <td>$26.33</td>
    </tr>
</table>
<h3>Important information that you should know about these stocks: </h3>
<ul>
    <li>0.1% of the trade value if the total trade value is less than $10,000</li>
    <li>0.08% of the trade value if the total trade value is greater than or equal to $10,000</li>
    <li>The minimum commission is $5</li>
</ul>

<form name="calculator">
    <input type="hidden" id="price1" value="43.93" />
    <input type="hidden" id="price2" value="43.87" />
    <input type="hidden" id="price3" value="26.33" />
    <p> Enter the number of Oracle Corporation stocks you wish to purchase!: <input type="text" id="input1"></p> <br>
    <p> Enter the number of Microsoft Corporation stocks you wish to purchase!: <input type="text" id="input2"></p> <br>
    <p> Enter the number of Symantec Corporation stocks you wish to purchase!: <input type="text" id="input3"></p> <br>
    <input type="button" value="Add!" onclick="javascript:sumUp()" />
</form>

<script type="text/javascript">
    function sumUp() {
        var total = (document.getElementById("price1").value * document.getElementById("input1").value) + (document.getElementById("price2").value * document.getElementById("input2").value) + (document.getElementById("price3").value * document.getElementById("input3").value)
        alert("Your total is: $" + total);
    }
</script>

这是将总数放入文本框的代码。这将在表单的末尾,并替换第一个示例中的<script>块。

<p>Your total is: $<input type="text" id="total" /></p>

<script type="text/javascript">
    function sumUp() {
        var total = (document.getElementById("price1").value * document.getElementById("input1").value) + (document.getElementById("price2").value * document.getElementById("input2").value) + (document.getElementById("price3").value * document.getElementById("input3").value)
        document.getElementById("total").value = total;
    }
</script>