史萊姆論壇 - 如何用HTML寫價格試算

史萊姆論壇 (http://forum.slime.com.tw/)

- 程式語言討論區 (http://forum.slime.com.tw/f76.html)

- - 如何用HTML寫價格試算 (http://forum.slime.com.tw/thread240119.html)

如何用HTML寫價格試算

請問用HTML寫價格試算方便嗎？要怎麼寫？或是那邊有範本？

我有找到光華商場的試算表，但是我不會寫程式，只會用改的http://www.arclink.com.tw/keisan.do?action=1

我要的不難，就只是一個項目有幾個規格價錢選項與統計而已 .....

我說的有人聽的懂嗎？:on_36:

其實價格試算, 用網頁來做, 有點累...
(如果已經有寫過一個成品了, 就很快)

這個網路上範本不多(光華商場的也只支援IE, 不支援FireFox)

你把需求貼上來吧, 我幫你想想看~

引用:

作者: cwvdavid (文章 2067677)

因為是我這行的資料，本來想用excel寫，可是無奈已經忘掉怎麼寫了，而且又不能較簡單的提供給想要用的人...

我是想將底下資料，再加上我各地收刮的資料用試算的方式，比較不用算的很累
http://www.mso.taipei.gov.tw/cgi-bin...?page=452de447

不過應該沒人願意寫，我才想找資料寫寫看 :on_14::on_14::on_14:

若可以找程式資料給我也行，我改改看，要不就光華版看能不能改.... :on_44:

感謝喔

用Dreamweaver 寫…第一頁的表單用核取方塊…值傳到第二頁運算後再傳出來

但是您的選項…禮堂部分跟冷氣部分有相關…

太麻煩了… 我的程度不夠不會寫… 除非每項都手選…然後傳到第二頁運算

這是比較單純的寫法,
每一種類別都各別區分(沒有特別分平日跟假日)

要加平日跟假日, 就是再加1個 [選單], 去選擇平日跟假日...

如果有整理過後的列表 : (不一定要實際的價格或內容, 但要能夠歸納出公式)
那我就可以直接寫出一個來
(如果可以, 要請你把實際搜括的部份, 也列出來, 這樣比較好處理)

語法:



<html>



<head>

<meta http-equiv="Content-Language" content="zh-tw">

<meta http-equiv="Content-Type" content="text/html; charset=big5">

<title>價格加總</title>

</head>



<body>







<table border="1" width="400" id="table1">

        <tr>

                <td>項目類別</td>

                <td>項目</td>

                <td>單價</td>

        </tr>

        <tr>

                <td>○○類</td>

                <td>

                        <select size="1" onchange="setMoney(this, 'D1_price')">

                                <option value="0">不需要</option>

                                <option value="1000">○○1號</option>

                                <option value="900">○○2號</option>

                                <option value="800">○○3號</option>

                                <option value="700">○○4號</option>

                                <option value="1100">○○5號</option>

                                <option value="1300">○○6號</option>

                        </select>

                </td>

                <td><span id="D1_price">0</span></td>

        </tr>

        <tr>

                <td>●◎類</td>

                <td>

                        <select size="1" onchange="setMoney(this, 'D2_price')">

                                <option value="0">不需要</option>

                                <option value="1000">●◎1號</option>

                                <option value="900">●◎2號</option>

                                <option value="800">●◎3號</option>

                                <option value="700">●◎4號</option>

                                <option value="1100">●◎5號</option>

                                <option value="1300">●◎6號</option>

                        </select></td>

                <td><span id="D2_price">0</span></td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>總計</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td><span id="total_price">0</span></td>

        </tr>

</table>





<script>



        function setMoney(myddl, targetID)

        {

                //設定單價

                document.getElementById(targetID).innerHTML = myddl.value;

                

                //計算總價

                countTotal();

        }



        function countTotal()

        {

                //所有的單價的標籤id...要用分號區隔

                var priceID = "D1_price;D2_price";

                

                //將所有的單價標籤, 轉成陣列, 以便加總金額

                var myPriceArray = priceID.split(";");

                

                var myCount = 0;

                

                for (var i=0;i< myPriceArray.length;i++)

                {

                        if(document.getElementById(myPriceArray[i]))

                        {

                                myCount = myCount + (document.getElementById(myPriceArray[i]).innerHTML * 1);

                        }

                        else

                        {

                                alert("找不到價格標籤的ID : " + myPriceArray[i]);

                                return false;

                        }

                }

                

                document.getElementById("total_price").innerHTML = myCount;

        }



</script>



<p>說明：<br>

1. 請依類別需要，放置下拉式選單<br>

2. 下拉式選單的 value(值)，請填入 金額(數字)，以便計算<br>

3. 下拉式選單請設置 onchange的事件，【setMoney(this, 單價的標籤的ID)】<br>

4. 在程式碼 function countTotal() 裡面，第一行就是全部的單價標籤，請依實際單價的數量自行修改...<br>

&nbsp;&nbsp;&nbsp; 如果有５個單價，分別為 id=&quot;A1&quot; ,&nbsp; id=&quot;A2&quot;,&nbsp; id=&quot;A3&quot;,&nbsp; 

id=&quot;A4&quot;,&nbsp; id=&quot;A5&quot;<br>

&nbsp;&nbsp;&nbsp; 那麼請將 var priceID = &quot;D1_price;D2_price&quot;; 修改成 var priceID = 

&quot;A1;A2;A3;A4;A5&quot;;<br>

<br>

以上...(支援 IE , FireFox)</p>



</body>



</html>

cwvdavid真強，感謝阿，那我過幾天整理一下，我在跟你說...... （這幾天比較忙.....）

請問HTML有辦法讀入資料嗎？
就是資料用TXT方式記錄，在讀入網頁中

檔案都放在網路上的話, 可以...
但必須放在一起...

(利用JavaScript的 XMLHttp)

回正題, 你提供的網址, 每一家都不一樣:on_22:

甚至有幾家是相衝的...

所以我先以第一個連結的內容, 大致改了一下,
你參考看看

語法:



<html>



<head>

<meta http-equiv="Content-Language" content="zh-tw">

<meta http-equiv="Content-Type" content="text/html; charset=big5">

<title>價格加總</title>

</head>



<body>







<table border="1" width="600" id="table1">

        <tr>

                <td>項目類別</td>

                <td>項目</td>

                <td>數量</td>

                <td>小計</td>

        </tr>

        <tr>

                <td>禮堂使用費</td>

                <td>

                        <select id="D1_ddl" size="1" onchange="setMoney('D1_ddl', 'D1_Amount', 'D1_price')">

                                <option value="0">不需要</option>

                                <option value="1800">甲級</option>

                                <option value="750">乙級</option>

                                <option value="600">丙級</option>

                                <option value="225">丁級</option>

                        </select>

                </td>

                <td><input id="D1_Amount" type="text" onkeyup="setMoney('D1_ddl', 'D1_Amount', 'D1_price')" value="1" size="5"></td>

                <td><span id="D1_price">0</span></td>

        </tr>

        <tr>

                <td>禮堂冷氣費</td>

                <td>

                        <select id="D2_ddl" size="1" onchange="setMoney('D2_ddl', 'D2_Amount', 'D2_price')">

                                <option value="0">不需要</option>

                                <option value="1200">甲級</option>

                                <option value="450">乙級</option>

                                <option value="300">丙級</option>

                                <option value="150">丁級</option>

                        </select></td>

                <td><input id="D2_Amount" type="text" onkeyup="setMoney('D2_ddl', 'D2_Amount', 'D2_price')" value="1" size="5"></td>

                <td><span id="D2_price">0</span></td>

        </tr>

        <tr>

                <td>XX使用費</td>

                <td>

                        <select id="D3_ddl" size="1" onchange="setMoneySpecial('D3_ddl', 'D3_Amount', 'D3_price')">

                                <option value="0;0;0">不需要</option>

                                <option value="1000;3;300">甲級1000,超過3小時加收300</option>

                                <option value="700;3;300">乙級700,超過3小時加收300</option>

                                <option value="400;3;200">丙級400,超過3小時加收200</option>

                        </select>

                </td>

                <td>

                <input id="D3_Amount" type="text" onkeyup="setMoneySpecial('D3_ddl', 'D3_Amount', 'D3_price')" value="1" size="5"></td>

                <td><span id="D3_price">0</span></td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td>總計</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td><span id="total_price">0</span></td>

        </tr>

</table>





<script>

        //所有的單價的標籤id...要用分號區隔

        var priceID = "D1_price;D2_price";



        //計算金額(一般)

        function setMoney(myddl, AmountID, targetID)

        {

                if(!document.getElementById(myddl))

                {

                        alert("選單項目：[" + myddl+ "]不存在");

                        return false;

                }





                if(!document.getElementById(AmountID))

                {

                        alert("數量欄位：[" + AmountID + "]不存在");

                        return false;

                }





                if(!document.getElementById(targetID))

                {

                        alert("小計欄位：[" + targetID + "]不存在");

                        return false;

                }





                //設定單價

                document.getElementById(targetID).innerHTML = document.getElementById(myddl).value * document.getElementById(AmountID).value;

                

                //計算總價

                countTotal();

        }





        //計算金額(特殊)

        function setMoneySpecial(myddl, AmountID, targetID)

        {

                if(!document.getElementById(myddl))

                {

                        alert("選單項目：[" + myddl+ "]不存在");

                        return false;

                }





                if(!document.getElementById(AmountID))

                {

                        alert("數量欄位：[" + AmountID + "]不存在");

                        return false;

                }





                if(!document.getElementById(targetID))

                {

                        alert("小計欄位：[" + targetID + "]不存在");

                        return false;

                }





                myValue = document.getElementById(myddl).value.split(";"); //用分號區隔金額,上限時數,超時加收價

                if(myValue.length != 3)

                {

                        alert('項目內的值設定錯誤, 請更正為 金額;超時時數,超時加收價');

                }



                if(document.getElementById(AmountID).value > myValue[1])

                        myOverHour = document.getElementById(AmountID).value - myValue[1];

                else

                        myOverHour = 0;



                //設定單價

                document.getElementById(targetID).innerHTML = (myValue[0] * document.getElementById(AmountID).value) + (myOverHour * myValue[2]);

                

                //計算總價

                countTotal();

        }







        function countTotal()

        {

                

                //將所有的單價標籤, 轉成陣列, 以便加總金額

                var myPriceArray = priceID.split(";");

                

                var myCount = 0;

                

                for (var i=0;i< myPriceArray.length;i++)

                {

                        if(document.getElementById(myPriceArray[i]))

                        {

                                myCount = myCount + (document.getElementById(myPriceArray[i]).innerHTML * 1);

                        }

                        else

                        {

                                alert("找不到價格標籤的ID : " + myPriceArray[i]);

                                return false;

                        }

                }

                

                document.getElementById("total_price").innerHTML = myCount;

        }



</script>



</body>



</html>

不好意思，因為各地縣市政府的規費並不一樣...........，所以我才想寫一個這樣的程式，省得老是要查來查去..... :on_67:
感謝，我在來研究一下....... :on_22:

由於我對禮儀業不熟, 不知道計費方式及流程,
哪些必要哪些不必要等等

所以, 如果是我要寫, 我會各別依不同縣市去寫....

每個縣市一支程式(獨立運作)

這樣才不會太過麻煩

也才不會被程式本身的限制卡死

剛剛才發現最麻煩的是冷藏費用，尤其是台北市的計算超麻煩........ :on_31:

台北市的...

請參考...

語法:

<html>



<head>

<meta http-equiv="Content-Language" content="zh-tw">

<meta http-equiv="Content-Type" content="text/html; charset=big5">

<title>價格加總</title>

</head>



<body>







<p><br>

　</p>







<table border="1" width="600" id="table1">

        <tr>

                <td colspan="4">使用級數：<select id="UserType_ddl" size="1" onchange="CountALL();">

                                <option value="0">甲級</option>

                                <option value="1">乙級</option>

                                <option value="2">丙級</option>

                                <option value="3">丁級</option>

                        </select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

日期類別：<select id="DateType_ddl" size="1" onchange="CountALL();">

                                <option value="0">平日</option>

                                <option value="1">減價日</option>

                                <option value="2">加價日</option>

                        </select><p>　</td>

        </tr>

        <tr>

                <td>項目類別</td>

                <td>說明</td>

                <td>數量</td>

                <td>小計</td>

        </tr>

        <tr>

                <td>禮堂使用費</td>

                <td>

                        依甲乙丙丁級區分，依平日或加價減價日分

                </td>

                <td><input id="PlaceUse_Amount" type="text" onkeyup="CountALL();" value="1" size="5">小時</td>

                <td><span id="PlaceUse_price">0</span></td>

        </tr>

        <tr>

                <td>禮堂冷氣費</td>

                <td>

                        依甲乙丙丁級區分</td>

                <td><input id="PlaceCold_Amount" type="text" onkeyup="CountALL();" value="1" size="5">小時</td>

                <td><span id="PlaceCold_price">0</span></td>

        </tr>

        <tr>

                <td>禮堂善後處理費</td>

                <td>

                        依甲乙丙丁級區分</td>

                <td>

                <input id="PlaceAfter_Amount" type="text" onkeyup="CountALL()" value="1" size="5">次</td>

                <td><span id="PlaceAfter_price">0</span></td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td colspan="4">　<p><br>

                以下資料設籍外縣市者３倍：<select id="LiveCity_ddl" onchange="CountALL();" size="1">

                                <option value="1">設籍本市</option>

                                <option value="3">設籍外縣市</option>

                        </select></td>

        </tr>

        <tr>

                <td>項目類別</td>

                <td>說明</td>

                <td>數量</td>

                <td>小計</td>

        </tr>

        <tr>

                <td>火葬費</td>

                <td>設籍本市者2,000</td>

                <td>

                <input id="D3_Amount0" type="text" onkeyup="CountALL();" value="1" size="5" name="T1">具</td>

                <td><span id="D3_price0">0</span></td>

        </tr>

        <tr>

                <td>骨灰罐寄存</td>

                <td>設籍本市者10,000元</td>

                <td>

                <input id="D3_Amount1" type="text" onkeyup="CountALL();" value="1" size="5" name="T2">個</td>

                <td><span id="D3_price1">0</span></td>

        </tr>

        <tr>

                <td>檢骨罈寄存</td>

                <td>設籍本市者30,000元</td>

                <td>

                <input id="D3_Amount2" type="text" onkeyup="CountALL();" value="1" size="5" name="T3">個</td>

                <td><span id="D3_price2">0</span></td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td>　</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td>總計</td>

        </tr>

        <tr>

                <td>　</td>

                <td>　</td>

                <td>　</td>

                <td><span id="total_price">0</span></td>

        </tr>

</table>





<script>



        var PlacePrice = new Array(); //禮堂使用費

        PlacePrice[0] = new Array("1800","600","3600"); //甲級使用費 : 平日，減價日，加價日

        PlacePrice[1] = new Array("750","300","1500"); //乙級使用費 : 平日，減價日，加價日

        PlacePrice[2] = new Array("600","225","1200"); //丙級使用費 : 平日，減價日，加價日

        PlacePrice[3] = new Array("225","75","450"); //丁級使用費 : 平日，減價日，加價日



        var ColdPrice = new Array("1200","450","300","150"); //冷氣使用費，甲乙丙丁４級



        var AfterOperationPrice = new Array("500","300","200","100"); //禮堂善後處理費  甲級500元,乙級300元,丙級200元,丁級100元



        //所有的單價的標籤id...要用分號區隔

        var priceID = "PlaceUse_price;PlaceCold_price;PlaceAfter_price;D3_price0;D3_price1;D3_price2";



        function CountALL() //計算總金額...

        {

                //禮堂使用費

                document.getElementById("PlaceUse_price").innerHTML = PlacePrice[document.getElementById("UserType_ddl").value][document.getElementById("DateType_ddl").value] * document.getElementById("PlaceUse_Amount").value;



                //禮堂冷氣費

                document.getElementById("PlaceCold_price").innerHTML = ColdPrice[document.getElementById("UserType_ddl").value] * document.getElementById("PlaceCold_Amount").value;

                

                //禮堂善後處理

                document.getElementById("PlaceAfter_price").innerHTML = ColdPrice[document.getElementById("UserType_ddl").value] * document.getElementById("PlaceAfter_Amount").value;

                

                //火葬費

                document.getElementById("D3_price0").innerHTML = document.getElementById("LiveCity_ddl").value * 2000 * document.getElementById("D3_Amount0").value;



                //骨灰罐寄存

                document.getElementById("D3_price1").innerHTML = document.getElementById("LiveCity_ddl").value * 10000 * document.getElementById("D3_Amount1").value;



                //檢骨罈寄存

                document.getElementById("D3_price2").innerHTML = document.getElementById("LiveCity_ddl").value * 30000 * document.getElementById("D3_Amount2").value;

                

                







                //將所有的單價標籤, 轉成陣列, 以便加總金額

                var myPriceArray = priceID.split(";");

                

                var myCount = 0;

                

                for (var i=0;i< myPriceArray.length;i++)

                {

                        if(document.getElementById(myPriceArray[i]))

                        {

                                myCount = myCount + (document.getElementById(myPriceArray[i]).innerHTML * 1);

                        }

                        else

                        {

                                alert("找不到價格標籤的ID : " + myPriceArray[i]);

                                return false;

                        }

                }

                

                document.getElementById("total_price").innerHTML = myCount;



        }





        //執行一次總計算．．．

        CountALL();

</script>



</body>



</html>