表格計算器

我想爲我的網站製作一張表格，在那裏我可以爲客戶計算重新接線的成本。我已經完成了HTML元素，但我正在努力做到JavaScript。表格計算器

我想表明的是：

<b> 
<form id="rewire" action=""> 
    <p>Occupancy<br /> 
    Empty<input type="radio" name="occupancy" value="empty" /><br /> 
    Occupied<input type="radio" name="occupancy" value="livedin" /><br /> 
    <br /> 
Type of property 
<br /> 
    <select name="property"> 
     <option value="bungalow">Bungalow</option> 
     <option value="terraced">Terraced</option> 
     <option value="detached">Semi/Detached</option> 
    </select> 
    <br /><br /> 
Number of rooms 
<br /> 
Bedrooms 
<br /> 
    <select name="bedrooms"> 
     <option value="1bed">1</option> 
     <option value="2bed">2</option> 
     <option value="3bed">3</option> 
     <option value="4bed">4</option> 
     <option value="5bed">5</option> 
     <option value="6bed">6</option> 
     <option value="7bed">7</option> 
     <option value="8bed">8</option> 
    </select> 
     <br /><br /> 
Living Rooms 
<br /> 
    <select name="Livingrooms"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
    </select> 
      <br /><br /> 
Bathrooms 
<br /> 
    <select name="bathrooms"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
    </select> 
      <br /><br /> 
Kitchens 
<br /> 
    <select name="Kitchens"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
    </select> 
      <br /><br /> 
Dining Rooms 
<br /> 
    <select name="Diningrooms"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
    </select> 
</form> 
</b>

我想計算器從形式加起來單獨的元素。例如： -

每個臥室增加的£210
每個起居室成本£270
每個衛生間£305
每個kithen£470
每個餐室£210

，如果它被住在+£250

梯田+£250
梯田+閣樓£350

+ 340英鎊用於隱藏表格中的標準成本。

來源

2013-05-06 Ashley Speight

我試過使用另一個基於腳本的腳本的模板，但只是完全搞砸了。如果有人能夠解釋如何做到這一點，我可以從中解決。 :-) – 2013-05-06 16:09:55

1）找到表單元素2）得到它的值3）將它乘以成本/每一個4）加總。 – jpaugh 2013-05-06 16:12:44

並使用真實數字爲您的臥室價值。 '8bed'讓我想哭。 – jpaugh 2013-05-06 16:13:34

您應該在每個表單元素上添加一個ID，以便更容易用javascript進行定位。例如：

<select name="property" id="property">

我也強烈建議包括jQuery，這使得從不同的表單元素獲取值更容易。如果你這樣做，那麼JavaScript的是這樣的：

function calc(){ 
    total = 340; 
    total += $("#livingroom").val() * 270; 
    //etc 

}

來源

2013-07-06 14:47:10

不要忘記

你不應該使用1bed，2bed等你應該使用1,2等作爲值。

HTML代碼必須接近這一點：

<select name="property"> 
    <option name="bungalow" value="itscost(ex:110$)">Bungalow</option> 
    <option name="terraced" value"itscost">Terraced</option> 
    <option name="detached" value"itscost">Semi/Detached</option> 
    </select> 
<select name="bedrooms"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
    <option value="6">6</option> 
    <option value="7">7</option> 
    <option value="8">8</option> 
</select>

jQuery代碼：

var abc = $("select[name=property] option:selected").val(); 
var def = $("select[name=bedrooms] option:selected").val(); 
//each bedroom 210$ 
var bedroomscost = def * 20; 
var total = abc + bedroomcost + livingroomcost.... etc. ;

你應該讓這些。我希望我能說得很清楚。

來源

2013-07-06 15:20:27 Lightsaber

如果你想爲你的網站創建一個計算器，我建議你看看「Appizy」。

它可以立即將電子表格轉換爲HTML和JAVASCRIPT中的獨立Web計算工具。您不需要對整個界面和計算公式進行硬編碼！

只需使用Open-或LibreOffice創建工作計算器，然後使用Appizy。

我希望它能提供幫助。最好的， Nicolas

來源

2014-01-14 16:39:09

相關問題

回答

相關問題