本文实例为大家分享了商品价格计算的具体代码,利用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>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持程序员的世界。

利用ajax+php实现商品价格计算的更多相关文章

  1. php中__call()方法使用

    <无详细内容>"","where"=>"","order"=>"","limit"=>"","group"=&......

  2. 【函数分享】每日PHP函数分享

    str_pad() 使用另一个字符串填充字符串为指定长度 。string str_pad ( string $input, int $pad_length[, string $pad_string=" "[, int $pad_type=STR_PAD_RIGHT]])参数描......

  3. PHP 非常实用下载远程图片

    /*** 下载远程图片* @param string $url 图片的绝对url* @param string $filepath 文件的完整路径(例如/wwwhttp://www.580doc.com/images/test) ,此函数会自动根据图片url和http头信息确定图片的后缀名* @param string $filename ......

  4. php微信小程序解包过程实例详解

    这个解包只能看个大概1.找到小程序压缩包1.1、手机root或安装模拟器(我用的是夜神)1.2、在模拟器上安装微信(用android5系统的模拟器,低版本小程序容易打不开)1.3、打开登陆微信后,打开小程序1.4、打开模拟器自带的文件管理器来到目录:/data/data/com.tencent.mm......

  5. php的curl携带header请求头信息实现http访问的方法

    导读:curl请求时添加请求头信息可以模拟真人操作,不容易被当成是爬虫机器人(采集),从而可以绕过Incapsula等安全验证机制。1、首先使用浏览器(示例使用的是火狐浏览器)访问接口网址,使用F12调试,查看请求头信息,如下:2、实现代码:?1234567891011121314151617181......

  6. PHP中强制类型转换的示例详解

    前言学过静态语言开发的朋友对类型转换不会陌生,比如Java、C#、C++等。静态语言的好处就是变量强制必须指定类型,这也是编译的要求,所以大部分编译型的语言都会有强制变量类型的要求。而PHP据说也会在PHP8中加入JIT实现编译功能,并且在7.4中就会引入变量声明时的类型指定。下面我们先看看目前PH......

  7. php 繁体简体互转类

    utf8_gb2312 = "么万与丑专业丛东丝丢两严丧个丬丰临为丽举么义乌乐乔习乡书买乱争于亏云亘亚产亩亲亵亸亿仅从仑仓仪们价众优伙会伛伞伟传伤伥伦伧伪伫体余佣佥侠侣侥侦侧侨侩侪侬俣俦俨俩俪俭债倾偬偻偾偿傥傧储傩儿兑兖党兰关兴兹养兽冁内冈册写军农冢冯冲决况冻净凄凉凌减凑凛几凤凫凭凯击凼凿......

  8. 在PHP中灵活使用foreach+list处理多维数组的方法

    先抛出问题,有时候我们接收到的参数是多维数组,我们需要将他们转成普通的数组,比如: $arr = [ [1, 2, [3, 4]], [5, 6, [7, 8]],]; 我们需要的结果是元素1变成1,2,3,4,元素2变成5,6,7,8,这时候,我们就可以用foreach配合list来实......

  9. php中使用array_filter()函数过滤数组实例讲解

    在数组中元素的过滤上,有一种方法比较特殊,结合了回调函数的使用,通过键值来与函数进行对应。相信说到这里很多人对于这种函数方法已经很好奇了,它就是array_filter() 函数的使用。接下来我们对该函数的定义、语法、参数、返回值、实例进行全面的介绍,具体过滤方法展现如下。1、定义array_fil......

  10. php swoft框架实例用法

    在框架选择上,不少人会觉得swoft才是最强PHP框架,尤其是在常驻内存模式的应用级高性能框架,性能是这一堆页面级框架遥不可及的,但是使用上稍微有点欠缺,内容稍微复杂,不如easyswoole好上手,但是性能上是绝对的好用,大家如果在编写项目时候,强烈要求使用性能,就可以了解下这个框架。使用场景微服......

随机推荐

  1. Java 添加数字签名到Excel以及检测、删除签名

    Excel中可添加数字签名以供文档所有者申明文档的所有权或有效性。文本以Java代码示例介绍如何在Excel文档中对数字签名功能进行相关操作,包括如何添加签名到Excel、检测Excel文档是否已签名,以及如何删除Excel文档中的签名。本次代码测试环境Excel版本:2013编译环境:Intell......

  2. JVM系列(三):JVM创建过程解析

    上两篇中梳理了整个java启动过程中,jvm大致是如何运行的。即厘清了我们认为的jvm的启动过程。但那里面仅为一些大致的东西,比如参数解析,验证,dll加载等等。把最核心的loadJavaVM()交给了一个dll或者so库。也就是真正的jvm我们并没有接触到,我们仅看了一个包装者或者是上层应用的实现......

  3. Linux学习之编译运行.c(C语言)文件

    在Linux命令行界面下,创建文件hello.c,进入vim编辑器,编辑一个简单的C语言文件 分解C语言文件执行过程,要经过预编译、编译、汇编、连接四个步骤后才能执行,预编译:gcc -E hello.c -o hello.i 先将.c文件预编译为.i文件 编......

  4. python基于opencv实现人脸识别

    将opencv中haarcascade_frontalface_default.xml文件下载到本地,我们调用它辅助进行人脸识别。识别图像中的人脸#coding:utf-8import cv2 as cv# 读取原始图像img = cv.imread('face.png')# 调用熟悉的人脸分类器 ......

  5. ASP.NET Core错误处理中间件[3]: 异常处理器

    DeveloperExceptionPageMiddleware中间件错误页面可以呈现抛出的异常和当前请求上下文的详细信息,以辅助开发人员更好地进行纠错诊断工作。ExceptionHandlerMiddleware中间件则主要面向最终用户,我们可以利用它来显示一个友好的定制化错误页面。Develop......

  6. vue3常用的API

    vue3.x已经发布了这么久,相关的生态也慢慢起来了,包括vite这个新的打包工具,在vue3.0学习过程中有一些实用性的api对比,希望能在开发中给大家做个示范,准确的使用对应的api去完成我们的项目开发生命周期的变更要特别说明一下的就是,setup 函数代替了 beforeCreate 和 cr......

  7. JavaScript 中的六种循环方法

    Javascript中的遍历循环1.for循环对于数值索引的数组来说,可以使用标准的for循环来遍历值const arr=[1,2,3,4];for(let i=0;i2.for...in循环for...in循环可以用来遍历对象的可枚举属性列表(包括原型链上的属性)const myObject={}......

  8. python工具系列-弱口令工具

    python弱口令扫描工具-初始版本篇博客记录下基于python写的gui小工具,也是我学python以来自己动手写的第一款交互型的工具Tkinter: Tkinter 模块(Tk 接口)是 Python 的标准 Tk GUI 工具包的接口 .Tk 和 Tkinter可以在大多数的 Unix 平台下......

  9. .Net技术栈下的异步,你还在用同步方式进行开发吗?

    关于异步,其实是个老生常谈的话题,也是各大公司面试常问的问题之一.本文就几个点来介绍异步解决的问题注:对多线程的运行的基本机制要了解1、介绍有人可能会有疑问,为什么并行,非得用异步.多线程也已可以啊,多开两个线程不就行了.案例分析:现在有一个生活场景.需要煮饭(假设需要20分钟-机器煮)、洗衣服(假......

  10. Java 并发编程要点

    使用线程有三种使用线程的方法:实现 Runnable 接口;实现 Callable 接口;继承 Thread 类。实现 Runnable 和 Callable 接口的类只能当做一个可以在线程中运行的任务,不是真正意义上的线程,因此最后还需要通过 Thread 来调用。可以理解为任务是通过线程驱动从而......