1. <i id="s6b2k"><small id="s6b2k"></small></i>
    <b id="s6b2k"><bdo id="s6b2k"></bdo></b>
  2. <wbr id="s6b2k"></wbr>

    利用ajax+php實現商品價格計算_AJAX相關

    來源:腳本之家  責任編輯:小易  

    本文實例為大家分享了商品價格計算的具體代碼,利用ajax和php實現以下頁面

    index.php

    <!DOCTYPE html>
    <html>
    
    <head>
     <meta charset="utf-8" />
     <title>商品價格計算</title>
     <style type="text/css">
     table {
      border-collapse: collapse;
     }
    
     tr {
      text-align: center;
     }
    
     .a4 {
      text-align: right;
    
      /* padding-right: 15px; */
     }
    
     #myDiv {
      color: red;
     }
    
     input {
      border: 0;
     }
     </style>
    </head>
    
    <body>
     <form action="data.php" method="get">
     <table border="1" bordercolor="#00CCCC" cellpadding="20">
      <tr>
      <th>商品名稱</th>
      <th>購買數量(斤)</th>
      <th>商品價格(元/斤)</th>
      </tr>
      <tr>
      <td>香蕉</td>
      <td><input type="text" name="a1" value="0" id="n1" onchange="zongji()" /></td>
      <td>8</td>
      </tr>
      <tr>
      <td>蘋果</td>
      <td><input type="text" name="a2" value="0" id="n2" onchange="zongji()" /></td>
      <td>5</td>
      </tr>
      <tr>
      <td>橘子</td>
      <td><input type="text" name="a3" value="0" id="n3" onchange="zongji()" /></td>
      <td>7</td>
      </tr>
      <tr>
      <td colspan="3" class="a4">商品折扣:<span>0.8</span></td>
      </tr>
      <tr>
      <td colspan="3" class="a4">
       <div id="jiage">打折后購買商品總價格: 元</div>
      </td>
      </tr>
     </table>
    
    
     </form>
    
    
     <script>
     function zongji() {
      var b1 = document.getElementById("n1").value;
      var b2 = document.getElementById("n2").value;
      var b3 = document.getElementById("n3").value;
      //1.創建對象
      var xmlhttp;
      if (window.XMLHttpRequest) {
      // IE7+, Firefox, Chrome, Opera, Safari 瀏覽器執行代碼
      xmlhttp = new XMLHttpRequest();
      } else {
      // IE6, IE5 瀏覽器執行代碼
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      }
      //2.判斷對象是否準備就緒
      xmlhttp.onreadystatechange = function() {
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
       document.getElementById("jiage").innerHTML = xmlhttp.responseText;
      }
      };
      //3.發出請求
      xmlhttp.open(
      "GET",
      "demo.php?c1=" + b1 + "&c2=" + b2 + "&c3=" + b3,
      true
      );
      xmlhttp.send();
     }
     </script>
    </body>
    
    </html>

    data.php

    <p>
     <?php
     $d1 = $_GET["c1"];
     $d2 = $_GET["c2"];
     $d3 = $_GET["c3"];
     $sum = (intval($d1) * 8 + intval($d2) * +intval($d3) * 7) * 0.8;
     // $sum=$a1*7.99+$a2*6.89+$a3*3.99;
     echo "打折后購買商品總價格: $sum 元";
     ?>
    </p>


  3. 本文相關:
  4. ajax響應json字符串和json數組的實例(詳解)
  5. ajax開始準備篇
  6. 分享ajax創建簡單實例代碼
  7. 使用對象封裝ajax重復調用的方法
  8. 解決ajax請求后臺,有時收不到返回值的問題
  9. ajax 技術和原理分析
  10. ajax客戶端說明,xmlhttprequest對象
  11. iframe實現ajax文件上傳效果示例
  12. 前端ajax的各種與后端交互的姿勢
  13. ajax提交post請求案例分析
  14. 使用PHP+ajax實時顯示下面這里的行情數據
  15. 關于ajax ,php中定義兩個變量并賦值,如何用jQuery...
  16. 有沒有可能利用ajax實現無點擊提交數據到php中
  17. php如何和ajax搭配使用
  18. php的在線訂房的表單,輸入后,自動計算價格(在當...
  19. php ajax jquery這三個要怎么結合使用。
  20. ajax調用PHP類庫中的函數
  21. 如何利用AJAX+PHP處理表單查詢數據?
  22. jquery通過ajax調用php取得返回值,怎么做?
  23. ajax與PHP
  24. 網站首頁網頁制作腳本下載服務器操作系統網站運營平面設計媒體動畫電腦基礎硬件教程網絡安全javascriptasp.netphp編程ajax相關正則表達式asp編程jsp編程編程10000問css/htmlflex腳本加解密web2.0xml/rss網頁編輯器相關技巧安全相關網頁播放器其它綜合dart首頁php+ajax實現商品對比功能示例jquery+ajax請求本地數據加載商品列表頁并跳轉詳情頁的實現方法妙用ajax技術實現局部刷新商品數量和總價實例代碼php實現的簡單美國商品稅計算函數ajax響應json字符串和json數組的實例(詳解)ajax開始準備篇分享ajax創建簡單實例代碼使用對象封裝ajax重復調用的方法解決ajax請求后臺,有時收不到返回值的問題ajax 技術和原理分析ajax客戶端說明,xmlhttprequest對象iframe實現ajax文件上傳效果示例前端ajax的各種與后端交互的姿勢ajax提交post請求案例分析jquery ajax 向后臺傳遞數組參數ajax readystate的五種狀態詳解ajax中的async屬性值之同步和異步jquery實現ajax定時刷新局部頁面ajax傳遞多個參數具體實現ajax獲取數據中文亂碼問題最簡單ajax獲取數據然后顯示在頁面的實jquery ajax中使用serialize()方自己動手打造ajax圖片上傳(網上沒ajax 緩存問題的兩種解決方法(ie關于ajax的使用方法_例題、ajax的數據處理ajax的簡單實用實例代碼ajax初試之讀取數據篇實現代碼asp簡單的ajax留言板使用加載圖片解決在ajax數據加載中頁面出ajax開始準備入門篇[asp]天楓ajax blog v1.0 程序提供下載了淺析json與jsonp區別及通過ajax獲得json數ajax開發簡略 (第一部分)基于jquery.history解決ajax的前進后退問
    免責聲明 - 關于我們 - 聯系我們 - 廣告聯系 - 友情鏈接 - 幫助中心 - 頻道導航
    Copyright © 2017 www.yu113.com All Rights Reserved
    战天txt全集下载