Javascript вычисляет() функцию не работает в Firefox и Safari

Я установил форму, которая выполняет определенные базовые вычисления, используя функцию Calculate() в Javascript. Он имеет 5 полей выбора для QUANTITY, которые при изменении меняются «литры» и «общая сумма».Javascript вычисляет() функцию не работает в Firefox и Safari

Форма отлично работает в Chrome и Opera, но НЕ НИЧЕГО! в Firefox и Safari.

Вы можете проверить его здесь - http://jsfiddle.net/bksuru/ajsggpcg/

THE HTML:

<table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
    <td height="60" colspan="5" valign="top"><h2>Variants:</h2></td> 
    </tr> 
    <tr> 
    <td height="40" align="left"><div class="variant">Flowers:</div></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Size<select name="flowers_size" id="flsz" type="text" size="1" class="select2" tabindex="1" ><option selected="selected">200 ML</option></select></label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Price<input name="flowers_price" type="text" class="input5" id="flpr" tabindex="1" value="MRP 1495.00" readonly="readonly" /></label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Quantity<select name="flowers_quantity" id="flqt" type="text" size="1" class="select3" tabindex="1" oninput="calculate()"> 
     <option value="0">0</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
    </select></label></td> 
    <td height="45" align="right"><label>Litres<input name="flowers_litres" type="text" class="input6" id="fllt" tabindex="1" value="0.000" readonly="readonly" /></label></td> 
    </tr> 
    <tr> 
    <td height="40" align="left"><div class="variant">Fruits:</div></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Size<select name="fruits_size" id="frsz" type="text" size="1" class="select2" tabindex="1" ><option selected="selected">200 ML</option></select></label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Price<input name="fuits_price" id="frpr" type="text" class="input5" tabindex="1" value="MRP 1295.00" readonly="readonly" /> 
    </label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Quantity<select name="fruits_quantity" id="frqt" type="text" class="select3" size="1" tabindex="1" oninput="calculate()"> 
     <option value="0">0</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
     </select> 
    </label></td> 
    <td height="45" align="right"><label>Litres<input name="fruit_litres" id="frlt" type="text" class="input6" tabindex="1" value="0.000" readonly="readonly" /> 
    </label></td> 
    </tr> 
    <tr> 
    <td height="40" align="left"><div class="variant">Plantations:</div></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Size<select name="flowers_size" id="flsz" type="text" size="1" class="select2" tabindex="1" ><option selected="selected">200 ML</option></select></label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Price<input name="flowers_price" id="plpr" type="text" class="input5" tabindex="1" value="MRP 1195.00" readonly="readonly" /> 
    </label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Quantity<select name="flowers_quantity" id="plqt" size="1" class="select3" tabindex="1" oninput="calculate()"> 
     <option value="0">0</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
     </select> 
    </label></td> 
    <td height="45" align="right"><label>Litres<input name="plantations_litres" id="pllt" type="text" class="input6" tabindex="1" value="0.000" readonly="readonly" /> 
    </label></td> 
    </tr> 
    <tr> 
    <td height="40" align="left"><div class="variant">Vegetables:</div></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Size<select name="vegetables_size" id="vesz" type="text" size="1" class="select2" tabindex="1" ><option selected="selected">200 ML</option></select></label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Price<input name="vegetables_price" id="vepr" type="text" class="input5" tabindex="1" value="MRP 995.00" readonly="readonly" /> 
    </label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Quantity<select name="vegetables_quantity" id="veqt" size="1" class="select3" tabindex="1" oninput="calculate()"> 
     <option value="0">0</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
     </select> 
    </label></td> 
    <td height="45" align="right"><label>Litres<input name="vegetables_quantity" type="text" class="input6" id="velt" tabindex="1" value="0.000" readonly="readonly" /> 
    </label></td> 
    </tr> 
    <tr> 
    <td height="40" align="left"><div class="variant">Cereals:</div></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Size<select name="cereals_size" id="cesz" type="text" size="1" class="select2" tabindex="1" ><option selected="selected">200 ML</option></select></label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Price<input name="cereals_price" id="cepr" type="text" class="input5" tabindex="1" value="MRP 895.00" readonly="readonly" /> 
    </label></td> 
    <td height="45" align="right" style="padding-right:14px;"><label>Quantity<select name="cereals_quantity" id="ceqt" size="1" class="select3" tabindex="1" oninput="calculate()"> 
     <option value="0">0</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
     </select> 
    </label></td> 
    <td height="45" align="right"><label>Litres<input name="cereals_litres" id="celt" type="text" class="input6" tabindex="1" value="0.000" readonly="readonly" /> 
    </label></td> 
    </tr> 
    <tr> 
    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="total"> 
    <tr> 
    <td align="left" valign="middle"><label class="variant">Total Amount:<input name="total_amount" type="text" class="input7" id="tamt" tabindex="1" value="MRP 0.00" readonly="readonly" /></label></td> 
    <td align="right" valign="middle"><input name="Submit" type="button" class="button" value="SUBMIT"/></td> 
    </tr> 
</table> 
    </tr> 
    </table>

JAVASCRIPT:

function calculate() { 
     var flowersSize = 200; 
     var flowersPrice = 1495; 

     var fruitsSize = 200; 
     var fruitsPrice = 1295; 

     var plantationsSize = 200; 
     var plantationsPrice = 1195;  

     var vegetablesSize = 200; 
     var vegetablesPrice = 995; 

     var cerealsSize = 200; 
     var cerealsPrice = 895; 

     var flowersQuantity = flqt.options[flqt.selectedIndex].value; 
     var fruitsQuantity = frqt.options[frqt.selectedIndex].value; 
     var plantationsQuantity = plqt.options[plqt.selectedIndex].value; 
     var vegetablesQuantity = veqt.options[veqt.selectedIndex].value; 
     var cerealsQuantity = ceqt.options[ceqt.selectedIndex].value; 

     var flowersLitres = flowersSize * flowersQuantity/1000; 
     var fruitsLitres = fruitsSize * fruitsQuantity/1000; 
     var plantationsLitres = plantationsSize * plantationsQuantity/1000; 
     var vegetablesLitres = vegetablesSize * vegetablesQuantity/1000; 
     var cerealsLitres = vegetablesSize * cerealsQuantity/1000; 

     flowersLitres = parseFloat(Math.round(flowersLitres * 100)/100).toFixed(3); 
     fruitsLitres = parseFloat(Math.round(fruitsLitres * 100)/100).toFixed(3); 
     plantationsLitres = parseFloat(Math.round(plantationsLitres * 100)/100).toFixed(3); 
     vegetablesLitres = parseFloat(Math.round(vegetablesLitres * 100)/100).toFixed(3); 
     cerealsLitres = parseFloat(Math.round(cerealsLitres * 100)/100).toFixed(3); 

     fllt.value = flowersLitres; 
     frlt.value = fruitsLitres; 
     pllt.value = plantationsLitres; 
     velt.value = vegetablesLitres; 
     celt.value = cerealsLitres; 

     var totalAmount = flowersQuantity * flowersPrice + fruitsQuantity * fruitsPrice + plantationsQuantity * plantationsPrice + vegetablesQuantity * vegetablesPrice + cerealsQuantity * cerealsPrice; 

     totalAmount = parseFloat(Math.round(totalAmount * 100)/100).toFixed(2); 

     tamt.value = "MRP"+" "+totalAmount.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
    }

Любая помощь очень ценится.

Спасибо!

BK Сура

источник

2015-02-26 BK Suru

любые ошибки в консоли браузера –

Не думайте так Арун ... Можете ли вы уточнить пожалуйста? Благодаря! –

Вы используете onInput события. Это событие предназначено для input и textarea элементов. Неselect элементов.
Более конкретно

<input type="password"> 
<input type="search"> 
<input type="text"> 
<textarea>

Используйте onChange событие вместо этого.

Очевидно, что некоторые браузеры поддерживают onInput на других элементах, но это не стандарт.

Edit (Добавлен пример):

<select name="flowers_quantity" ... oninput="calculate()">

Изменить его:

<select name="flowers_quantity" ... onchange="calculate()">

источник

2015-02-26 08:34:36

Хорошо, да! оно работает! Большое спасибо! –

Спасибо, Сани! –

просто изменить метод oninput к OnChange

источник

2015-02-26 08:35:10

@BK Saru, Вам это полезно? Решено сейчас? –

Это сработало! Спасибо брат! –

Javascript вычисляет() функцию не работает в Firefox и Safari

ответ

Смежные вопросы