使用javascript从数字文本输入中获取值并将其乘以单选按钮

时间:2012-06-21 14:54:27

标签: javascript forms input radio-button multiplying

非常新的javascript。据我所知,其他类似的问题已被问到,但我需要一个解决方案来将它们整合在一起。任何和所有的帮助将不胜感激!

我有以下表单需要根据{用户数}乘以{包价格}来计算价格:

                    <form id="quote_form">

                        <fieldset>

                            <div class="input">
                                <label>Number of Users:</label> <input type="text" onkeypress="return isNumberKey(event)" name="text" />
                            </div>

                            <div class="input">
                                <label>24/7/365 Support:</label> <input type="checkbox" style="vertical-align:middle;margin:7px 0;" class="bgclear" />
                            </div>

                            <div class="input">

                                <table class="table-2 h7">

                                    <tbody>
                                        <tr>
                                            <td class="color3">Select a package:</td>
                                            <td class="color2">Standard <input id="r1" name="radioCh" value="standard" type="radio" class="bgclear" /></td>
                                            <td class="color2">Standard + <input id="r2" name="radioCh" value="standardPlus" type="radio" class="bgclear" /></td>
                                            <td class="color2">Advanced <input id="r3" name="radioCh" value="advanced" type="radio" class="bgclear" /></td>
                                        </tr>
                                        <tr>
                                            <td>Mail Box</td>
                                            <td>30 GB</td>
                                            <td>30 GB</td>
                                            <td>30 GB</td>
                                        </tr>
                                        <tr>
                                            <td>File Storage</td>
                                            <td>10 GB</td>
                                            <td>10 GB</td>
                                            <td>10 GB</td>
                                        </tr>
                                        <tr>
                                            <td>Microsoft Office</td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                        </tr>
                                        <tr> 
                                            <td>Microsoft Exchange</td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                        </tr>
                                        <tr>
                                            <td>Antivirus</td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                        </tr>
                                        <tr>
                                            <td>CRM</td>
                                            <td><img alt="not included" src="images/cross.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                        </tr>
                                        <tr>
                                            <td>Device Independent</td>
                                            <td><img alt="not included" src="images/cross.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                        </tr>
                                        <tr>
                                            <td>PBX &amp; VoIP</td>
                                            <td><img alt="not included" src="images/cross.png"></td>
                                            <td><img alt="not included" src="images/cross.png"></td>
                                            <td><img alt="included" src="images/tick.png"></td>
                                        </tr>
                                    </tbody>

                                </table>

                            </div>

                            <div class="input">
                                <a class="button-3" onclick="getTotal();_gaq.push(['_trackEvent','Quick Quote','Calculate Button','Quote Generated']);">Calculate<img alt="calculate" src="images/buttons/button-3-arrow.png"></a> <div id="finalPrice"></div>
                            </div>

                        </fieldset>

                    </form>

以下我用来返回值的js(我知道它不完整,目前不会从输入框中获取数值(不知道怎么做!)):

function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
    return false;

return true;
}

function getUserNumber() {
var employeeNum = 0;
var theForm = document.forms["quote_form"];
var numInput = theForm.elements["text"];
}

var monthFee = new Array();
monthFee["standard"]=60;
monthFee["standardPlus"]=80;
monthFee["advanced"]=95;

function getFastQuote() {
var fastQuote = 0;
var theForm = document.forms["quote_form"];
var radioButton = theForm.elements["radioCh"];

for(var i = 0; i < radioButton.length; i++)
{
    if(radioButton[i].checked)
    {
        fastQuote = monthFee[radioButton[i].value];
        break;
    }
}
return fastQuote;
}

function getTotal() {
var quotePrice = getFastQuote * getUserNumber;

document.getElementById('finalPrice').innerHTML = 'Price from: £' + quotePrice;
}

1 个答案:

答案 0 :(得分:0)

我认为你没有正确地调用你的js函数。你的代码是

var quotePrice = getFastQuote * getUserNumber;

虽然它应该是

var quotePrice = getFastQuote() * getUserNumber();

另请阅读@Diodeus关于字符串类型转换的注释。 您的getUserNumber()方法没有返回值,因此请将return numInput.value;添加为该函数的最后一行。