如何在php中創建pc計算器腳本

我有2個表格，一個是類別，一個是產品。現在我想要PC計算器。如何在php中創建pc計算器腳本

我有根據數據庫動態生成的所有字段。所以我怎麼寫腳本來製作這樣的。

<table ALIGN=CENTER WIDTH=100% BORDER=1 CELLSPACING=1 CELLPADDING=3> 
    <tr> 
     <th>Category Name</th> 
     <th>Product Name</th> 
     <th>Price</th> 
    </tr>   
    <tr class="odd"> 
     <td>Speaker</td> 
     <td> 
      <select name="1" size="1" id="1"> 
       <option value="1200.00">intex</option> 
       <option value="2100.00">creative</option> 
       <option value="1400.00">intex 2.1</option> 
       <option value="2000.00">intex 2.1 with woofer</option> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>Laptop</td> 
     <td> 
      <select name="3" size="1" id="3"> 
       <option value="31000.00">sony</option> 
       <option value="31500.00">hp</option> 
       <option value="31000.00">Acer</option> 
       <option value="36000.00">ibm</option> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>Mouse</td> 
     <td> 
      <select name="4" size="1" id="4"> 
       <option value="120.00"> teccom</option> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>CPU</td> 
     <td> 
      <select name="6" size="1" id="6"> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>Projector</td> 
     <td> 
      <select name="7" size="1" id="7"> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>Anti Virus</td> 
     <td> 
      <select name="23" size="1" id="23"> 
       <option value="450.00">McAfee</option> 
       <option value="1200.00">AVG</option> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>Processor</td> 
     <td> 
      <select name="59" size="1" id="59"> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>testing</td> 
     <td> 
      <select name="60" size="1" id="60"> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>sadfasdfasdfadsfad</td> 
     <td> 
      <select name="61" size="1" id="61"> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr class="odd"> 
     <td>dfgd</td> 
     <td> 
      <select name="62" size="1" id="62"> 
      </select> 
     </td> 
     <td><div id="t1" class="price">0</div></td> 
    </tr> 
    <tr> 
     <td></td> 
     <td>Total</td> 
     <td><div id="total"></div></td> 
    </tr> 
</table>

這裏是jQuery的

jQuery(document).ready(function() { 
    $("#sellp").change(function() { 
     var str = 0.00; 
     $("#sellp :selected").each(function() { 
      var test = $(this).val(); 
      //alert(test); 
      var tr = parseInt(str) + parseInt(test); 
      //alert(tr); 
      $("#t1").text(test); 
     }); 
    }); 
    var sum = 0; 
    $("form :element").change(function() { 
     $('.price').each(function() { 
     sum += parseFloat($(this).text()); 
    }); 
    $('#total').html(sum) }); 
});

來源

2011-04-11 Behind the screen

此應用程序的大部分是JavaScript，而不是PHP。 – 2011-04-11 14:12:53

是的我知道，我使用PHP，因爲我的應用程序是在PHP中。所以我該如何使用javascript – 2011-04-11 14:16:51

是的，你可以學習JavaScript。 – wong2 2011-04-11 14:35:10

首先表現出一定的代碼。

假設所有項目都在頁面加載時，你需要添加一些事件處理程序

這裏是純JS - jQuery的可能是更優雅。您可能需要從此開始，然後添加驗證。如果您以易於獲得的方式命名您的字段，您將使您的生活變得更加輕鬆。

<html> 
<head> 
<script> 
function calc(theForm) { 
    var total = 0; 
    for (var i=1;;i++) { 
    var item = theForm.elements["item_"+i]; 
    if (item) { 
     var price = item.options[item.selectedIndex].value; 
     if (price && !isNaN(price)) { 
     price = parseFloat(price); 
     total+=price; 
     var priceId = item.id.replace('item','price'); 
     document.getElementById(priceId).innerHTML=price.toFixed(2); 
     } 
    } 
    else break; 
    } 
    if (total) document.getElementById('total').innerHTML="$"+total.toFixed(2); 
} 
window.onload=function() { 
    var theForm = document.forms[0]; // first form on page 
    for (var i=0,n=theForm.elements.length;i<n;i++) { 
    if (theForm.elements[i].type.indexOf("select") !=-1) { 
     theForm.elements[i].onchange=function() { calc(this.form); } 
    } 
    } 
    theForm.onsubmit=function() { calc(this); return validate(this) } 
    calc(theForm) 
} 
</script> 
</head> 
<body> 
<form> 
<table ALIGN=CENTER WIDTH=100% BORDER=1 CELLSPACING=1 CELLPADDING=3 > 
          <tr> 
          <th>Category Name</th> 

          <th>Product Name</th> 

          <th>Price</th> 
          </tr>   
                 <tr class="odd"> 
          <td>Speaker </td> 


          <td><select name="item_1" size="1" id="item_1"> 
                  <option value="1200.00"> intex</option> 

                  <option value="2100.00"> creative</option> 
                  <option value="1400.00"> intex 2.1</option> 
                  <option value="2000.00"> intex 2.1 with woofer</option> 

          </select>       
          </td> 
          <td><div id="price_1" class="price">0</div></td> 

          </tr> 

          <tr class="odd"> 
          <td>Laptop </td> 


          <td><select name="item_2" size="1" id="item_2"> 
                  <option value="31000.00"> sony</option> 
                  <option value="31500.00"> hp</option> 

                  <option value="31000.00"> Acer</option> 
                  <option value="36000.00"> ibm</option> 

          </select>       
          </td> 
          <td><div id="price_2" class="price">0</div></td> 
          </tr> 

          <tr class="odd"> 

          <td>Mouse </td> 


          <td><select name="item_3" size="1" id="item_3"> 
                  <option value="120.00"> teccom</option> 

          </select>       
          </td> 
          <td><div id="price_3" class="price">0</div></td> 
          </tr> 

</table> 
</form> 
Total: <span id="total"></span>

來源

2011-04-11 14:35:41 mplungjan

嗨mplungjan，我已經添加了我的代碼，我正在使用jQuery，但無法獲得動態生成的選擇id。 – 2011-04-11 14:49:24

你不需要它們。代碼不斷調用表單對象。請顯示生成的html而不是PHP。我建議普通的JS而不是jQuery在這裏 – mplungjan 2011-04-11 14:52:25

我已經改變了我的HTML代碼上面。 – 2011-04-11 15:00:31

如何在php中創建pc計算器腳本

回答

相關問題