2012-06-21 1 views
0

очень новый для javascript. Насколько я могу судить, другие подобные вопросы были заданы, но мне нужно решение, чтобы собрать все это вместе. Любая помощь будет принята с благодарностью!Использование 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; 
} 
+0

Значения в входах - это ТЕКСТ, вам нужно преобразовать их в числовые типы данных, чтобы выполнить математику. num = parseInt (val) или num = parseFloat (val) –

+1

FYI: Как правило, гораздо быстрее получить помощь, если вы сделаете jsFiddle, иллюстрирующий вашу проблему. –

ответ

0

Я думаю, вы не вызывая свои функции Js правильно. Ваш код

var quotePrice = getFastQuote * getUserNumber; 

в то время как он должен быть

var quotePrice = getFastQuote() * getUserNumber(); 

прочитал также комментарий по @Diodeus о типе литья струн. Ваш метод getUserNumber() не имеет возвращаемого значения, поэтому добавьте return numInput.value; в качестве последней строки этой функции.