返回列表 發帖

求助高手js的欄位條件運算函式

可否請求高手幫我看看是哪里的問題
爬了好多文還是找不到相關的方法
試了好幾天一直試不出來

非常感謝
<script type="text/javascript">
function cal(obj) { 
        var t = obj.parentNode.getElementsByTagName("input");
        t[2].value = (t[0].value==""?0:parseFloat(t[0].value)) * (t[1].value==""?0:parseFloat(t[1].value));
        var resultObj = document.getElementsByName("result");
        var sum = 0;
        for (var i=0;i<resultObj.length;i++)
                sum += (resultObj.value==""?0:parseFloat(resultObj.value));
                  document.getElementById("prod_sum").value = sum ;
                if (sum >= 2000 || sum <= 3000) //如果合計大於等於2000或小於等於3000
                  document.getElementById("prod_discount").value = "0.8"; //則折數欄位顯示8折
                else (if sum >= 3001) //如果合計大於等於3001
                  document.getElementById("prod_discount").value = "0.7"; //則折數欄位顯示7折
                else //否則
                  document.getElementById("prod_discount").value = "0.9"; //折數欄位顯示9折
                if (sum <= 1200) //如果合計小於等於1200
                  document.getElementById("prod_ship").value = "75"; //則運費欄位顯示75元
                else (if sum >= 1201 || sum <= 1500) //如果合計大於等於1201或合計小於等於1500
                  document.getElementById("prod_ship").value = "100";//運費欄位顯示100元
                else //否則
                  document.getElementById("prod_ship").value = "0";//運費欄位顯示0元
    var total = 0;
             total = sum * (document.getElementById("prod_discount").value)+(document.getElementById("prod_ship").value);
                  document.getElementById("prod_total").value = total ;
}
</script>
[ 本帖最後由 ironman 於 2009-1-17 12:17 編輯 ]

你應該連同 HTML 一起 po 出來,並說明問題,否則只有一段 code 很難知道問題出在哪裡喔~
To infinity and beyond!

TOP

原帖由 wmh 於 2009-1-17 13:21 發表
你應該連同 HTML 一起 po 出來,並說明問題,否則只有一段 code 很難知道問題出在哪裡喔~


謝謝版大
我知道直接請求答案很不該
可是實在不懂js
我貼出全部html
<html>
<head>
<title>無標題文件</title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
<script> 
function cal(obj) { 
        var t = obj.parentNode.getElementsByTagName("input");
        t[2].value = (t[0].value==""?0:parseFloat(t[0].value)) * (t[1].value==""?0:parseFloat(t[1].value));
        var resultObj = document.getElementsByName("result");
        var sum = 0;
        for (var i=0;i<resultObj.length;i++)
                sum += (resultObj.value==""?0:parseFloat(resultObj.value));
        document.getElementById("prod_sum").value = sum;
                if (sum >= 2000 || sum <= 3000) //如果合計大於等於2000或小於等於3000
                  document.getElementById("prod_discount").value = "0.8"; //則折數欄位顯示8折
                else (if sum >= 3001) //如果合計大於等於3001
                  document.getElementById("prod_discount").value = "0.7"; //則折數欄位顯示7折
                else //否則
                  document.getElementById("prod_discount").value = "0.9"; //折數欄位顯示9折
                if (sum <= 1200) //如果合計小於等於1200
                  document.getElementById("prod_ship").value = "75"; //則運費欄位顯示75元
                else (if sum >= 1201 || sum <= 1500) //如果合計大於等於1201或合計小於等於1500
                  document.getElementById("prod_ship").value = "100";//運費欄位顯示100元
                else //否則
                  document.getElementById("prod_ship").value = "0";//運費欄位顯示0元
    var total = 0;
             total = sum * (document.getElementById("prod_discount").value)+(document.getElementById("prod_ship").value);
                  document.getElementById("prod_total").value = total ;
} 
</script>
</head>
<body>
<form action="" method="post" name="SendOrderForm" id="SendOrderForm">
  <table width="100%" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td align="center" ><br />
        <br />
        <table width="80%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td height="35" align="left"><table border="0" cellspacing="0" cellpadding="0">
                <tr>
                  <td width="132" height="47" align="center" valign="middle" ><b>筆記本類別</b></td>
                </tr>
              </table></td>
          </tr>
          <tr>
            <td><table width="100%" border="1" cellspacing="0" cellpadding="0">
                <tr> <br />
                  <td height="40" align="left" valign="middle"><font size="4">小熊維尼筆記</font>本<br />
                  </td>
                  <td width="30%" align="center" valign="middle"><b>新台幣:$
                    <input name="t1" type="text" value="299" size="4" readonly>
                    X
                    數量:
                    <input name="t2" type="text" onBlur="cal(this)" onChange="Comp(this)" size="4" />
                    =
                    <input name="result" type="text" size="4">
                    </b> <br /></td>
                </tr>
              </table>
              <table width="100%" border="1" cellspacing="0" cellpadding="0">
                <tr> <br />
                  <td height="40" align="left" valign="middle"><font size="4">小蜜蜂筆記本</font><br />
                  </td>
                  <td width="30%" align="center" valign="middle"><b>新台幣:$
                    <input name="t1" type="text" value="299" size="4" readonly>
                    X
                    數量:
                    <input name="t2" type="text" onBlur="cal(this)" onChange="Comp(this)" size="4" />
                    =
                    <input name="result" type="text" size="4">
                    </b> <br /></td>
                </tr>
              </table></td>
          </tr>
        </table>
        <br />
        <br />
        <br />
        <br />
        <table width="80%" height="97" border="1" cellpadding="0" cellspacing="0">
          <tr>
            <td height="30" align="right">合計</td>
            <td width="30%" align="center" valign="middle"><input type="text" name="prod_sum" id="prod_sum" /></td>
          </tr>
          <tr>
            <td height="30" align="right">折數</td>
            <td align="center" valign="middle"><input type="text" name="prod_discount" id="prod_discount" /></td>
          </tr>
          <tr>
            <td height="30" align="right">運費</td>
            <td align="center" valign="middle"><input type="text" name="prod_ship" id="prod_ship" /></td>
          </tr>
          <tr>
            <td height="30" align="right">總計 </td>
            <td align="center" valign="middle"><input type="text" name="prod_total" id="prod_total" /></td>
          </tr>
          <tr>
            <td height="40" colspan="2" align="center"><input type="submit" name="button" id="button" value="寄出訂單" />
              <input type="reset" name="button2" id="button2" value="取消" /></td>
          </tr>
        </table></td>
    </tr>
  </table>
</form>

</body>
</html>

TOP

你的思路大致沒錯,程式中有幾個小錯誤:

resultObj.value
->
resultObj[i].value

else (if
->
else if (
To infinity and beyond!

TOP

原帖由 wmh 於 2009-1-17 18:31 發表
你的思路大致沒錯,程式中有幾個小錯誤:

resultObj.value
->
resultObj.value

else (if
->
else if (

謝謝版大指點
目前可以運算了
可是總計的地方好像只有從合計的地方 * 折數
並不會自動再加上運費欄位內的數字
是哪個地方有錯嗎
還有可以讓我ㄧ輸入數量就啟動運算嗎
目前用onBlur好像要離開點其他元素才會異動
改為onKeyDown好像就可以了

而總計我有加Math.floor函數,可是好像只去除小數,並不會四捨五入
我再把我修改過js的貼上來
<script type="text/javascript">
function cal(obj) { 
        var t = obj.parentNode.getElementsByTagName("input");
        t[2].value = (t[0].value==""?0:parseFloat(t[0].value)) * (t[1].value==""?0:parseFloat(t[1].value));
        var resultObj = document.getElementsByName("result");
        var sum = 0;
        for (var i=0;i<resultObj.length;i++)
                sum += (resultObj.value==""?0:parseFloat(resultObj.value));
        document.getElementById("prod_sum").value = sum;
                if (sum >= 2000 && sum <= 3000) //如果合計大於等於2000並小於等於3000
                  document.getElementById("prod_discount").value = "0.8"; //則折數欄位顯示8折
                else if (sum >= 3001) //如果合計大於等於3001
                  document.getElementById("prod_discount").value = "0.7"; //則折數欄位顯示7折
                else //否則
                  document.getElementById("prod_discount").value = "0.9"; //折數欄位顯示9折
                if (sum <= 1200) //如果合計小於等於1200
                  document.getElementById("prod_ship").value = "75"; //則運費欄位顯示75元
                else if (sum >= 1201 && sum <= 1500) //如果合計大於等於1201並小於等於1500
                  document.getElementById("prod_ship").value = "100";//運費欄位顯示100元
                else //否則
                  document.getElementById("prod_ship").value = "0";//運費欄位顯示0元
    var total = 0;
             total = Math.floor(sum * (document.getElementById("prod_discount").value) + (document.getElementById("prod_ship").value));
                  document.getElementById("prod_total").value = total ;
}
</script>
而且我發現我貼帖時有加[i]
可是存檔後有時會不見
有的會被置換為<i>

[ 本帖最後由 ironman 於 2009-1-18 02:04 編輯 ]

TOP

四捨五入可以改用 Math.round()

你這邊實做時的另一個問題就是沒有用 JavaScript  的變數去紀錄值,而是直接用 <input> 的 value 去紀錄值,這樣在設值、取值都要多花一點點的時間,而且變數型態沒有處理好的話會有錯誤。

例如 prod_discount 和 prod_ship 都應該先紀錄在 JavaScript 變數中,等你全部的運算完成後,再一次設值到 <input> 內。目前的做法當你再次取出 document.getElementById("prod_ship").value 時會變成字串,和前面的值相加後,也是字串,而且剛好在小數點後面,這樣經過四捨五入後,會造成沒有加到運費的錯覺...

[i] 是因為剛好和討論區常用的 bbcode [i] 有相衝,表示文字要變成斜體,不過包在程式區段內的應該不會被解析才是,應該是討論區的 bug,我再找時間改一改。目前可以先用發文時旁邊的「禁用 Discuz!代碼」避免這個問題。
To infinity and beyond!

TOP

原帖由 ironman 於 2009-1-17 21:25 發表

謝謝版大指點
目前可以運算了
可是總計的地方好像只有從合計的地方 * 折數
並不會自動再加上運費欄位內的數字
是哪個地方有錯嗎
還有可以讓我ㄧ輸入數量就啟動運算嗎
目前用onBlur好像要離開點其他元素才會異動
改 ...


謝謝版大的協助
我可能對基本的js邏輯都還不太懂
因為是改人家寫好的,不知道完整正確的寫法,
我會再花時間努力學習的
台灣有您這個專業的社群真好

[ 本帖最後由 ironman 於 2009-1-19 16:56 編輯 ]

TOP

  

加油,有任何問題歡迎提出...
To infinity and beyond!

TOP

原帖由 wmh 於 2009-1-19 19:47 發表
  

加油,有任何問題歡迎提出...


謝謝
可以了,最後修正如下
<script type="text/javascript">
function cal(obj) { 
        var t = obj.parentNode.getElementsByTagName("input");
        t[2].value = (t[0].value==""?0:parseFloat(t[0].value)) * (t[1].value==""?0:parseFloat(t[1].value));
        var resultObj = document.getElementsByName("result");
        var sum = 0;
        for (var i=0;i<resultObj.length;i++)
                sum += (resultObj[i].value==""?0:parseFloat(resultObj[i].value));
        document.getElementById("prod_sum").value = sum;
                if (sum >= 2000 && sum <= 3000) //如果合計大於等於2000並小於等於3000
                  document.getElementById("prod_discount").value = "0.8"; //則折數欄位顯示8折
                else if (sum >= 3001) //如果合計大於等於3001
                  document.getElementById("prod_discount").value = "0.7"; //則折數欄位顯示7折
                else //否則
                  document.getElementById("prod_discount").value = "0.9"; //折數欄位顯示9折
                if (sum <= 1200) //如果合計小於等於1200
                  document.getElementById("prod_ship").value = "75"; //則運費欄位顯示75元
                else if (sum >= 1201 && sum <= 1500) //如果合計大於等於1201並小於等於1500
                  document.getElementById("prod_ship").value = "100";//運費欄位顯示100元
                else //否則
                  document.getElementById("prod_ship").value = "0";//運費欄位顯示0元
    var total = 0;
          total = Math.round(sum * (parseFloat(document.getElementById("prod_discount").value)) + parseFloat((document.getElementById("prod_ship").value))) ;
                  document.getElementById("prod_total").value = total;
}
</script>
另onKeyDown好像沒有反應,onKeyUp就可以了

[ 本帖最後由 ironman 於 2009-1-31 00:07 編輯 ]

TOP

返回列表 回復 發帖