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

Using javascript to get value from numeric text input and multiply it by radio button

本文关键字：单选按钮 获取 javascript 数字 文本 输入 使用      更新时间：2023-09-26

对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;
}

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

var quotePrice = getFastQuote * getUserNumber;

虽然它应该是

var quotePrice = getFastQuote() * getUserNumber();

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

相关文章：