JS 实现简单的操作（数量，单价，金额）

悠悠 2024-02-17 18:04 18阅读 0赞

**JS实现简单的操作**

<script type="text/javascript">
    
        // 通过值改变事件： 根据商品ID，获得价格 
        function fun(strs){
    	   //获得值
    	   var str = strs.value;
    	   
    	   //获得价格
    	   var  price = str.split("_")[1];
    	   
    	   document.getElementById("price").value=price;	
    	   
    	   //注意：获得数量/
    	   var  count =  document.getElementById("amout").value;
    	   //如果数量不为空，则可以计算金额
    	   if(count!=""){
    		   document.getElementById("money").value= parseInt(count)*parseFloat(price);
    	   }
    	   ///
    	
    	}
    	
    	//通过失去焦点事件： 根据数量，价格 计算金额
    	function fun2(num){
    		//获得数量值
    	   var str = num.value;
    	   //获得价格
    	   var  price =document.getElementById("price").value;
    	   
    	   //计算
    	   document.getElementById("money").value= parseInt(str)*parseFloat(price);
    	   
    		
    	}
    </script>
    
    
    <body>
    
    商品<select name="pid" id="pid" οnchange="fun(this)">
    
      <option value="1_5.58">苹果</option>
      <option value="2_4.56">香蕉</option>
      <option value="3_5.50">桔子</option>
      </select><p/>
      
     
    数量:<input type="text" id="amout" style="ime-mode:disabled;" οnpaste="return false;"  οnkeypress="return(event.keyCode>=48 && event.keyCode<=57)" οnblur="fun2(this)" />  <p/>
    
    价格:<input type="text" id="price" /><p/>
    
    金额:<input type="text" id="money" /><p/>
      
    </body>

**效果如下：**

**![Center][]**

**选择下拉列表的香蕉，获得价格**

**![Center 1][]**

**输入数量，计算出金额**

**![Center 2][]**

**选择下拉列表的桔子，获得价格,金额!**

**![Center 3][]**

[Center]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/8140628d823344a2b9261ae1409ae789.png
[Center 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/ef5982f2134941f78afde2c7a3d84759.png
[Center 2]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/409cf80b98e64764b198e2db05f4952a.png
[Center 3]: https://image.dandelioncloud.cn/pgy_files/images/2024/01/29/a47bfa18eec54f7aa2a8acdc412654f8.png

发表评论取消回复

表情：

评论列表（有 0 条评论，18人围观）

还没有评论，来说两句吧...

相关阅读

相关实现金额和数量检查的Java程序设计

实现金额和数量检查的Java程序设计在编程开发中，我们经常需要对金额和数量进行检查和验证。在本文中，我将为您介绍如何使用Java编写一个简单的程序来实现这一功能。首先，

缺乏、安全感/ 2024年03月23日 22:54/ 0 赞/ 39 阅读

相关 JS 实现简单的操作（数量，单价，金额）

JS实现简单的操作 <script type="text/javascript"> // 通过值改变事件：根据商品ID，获得价格

悠悠/ 2024年02月17日 18:04/ 0 赞/ 19 阅读

相关实现检查金额数量 Java

实现检查金额数量 Java 在Java中，我们可以使用数字格式化工具和正则表达式来实现检查金额数量。下面是一个示例代码，展示了如何实现这个功能： import ja

╰+攻爆jí腚メ/ 2023年10月15日 15:34/ 0 赞/ 45 阅读

相关 JS 使用节点实现简单购物车数量和金额

一、购物车中商品数量 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZ

快来打我*/ 2023年10月05日 08:34/ 0 赞/ 24 阅读

相关 js实现将数字金额翻译成中文的大写金额

-------------------- 一个实用的js函数，工作可以经常用到，上代码！效果 ![在这里插入图片描述][20200616194234121.gif]

怼烎@/ 2023年02月18日 08:17/ 0 赞/ 13 阅读

相关 php计算单价乘数量,数量单价怎么算出金额

快速导读： Q1：给出金额和单价怎么算数量总金额除于单价就是数量了啊 Q2：知道单价金额，怎么算出数量只用销售额就可以了 (但要有A计划数----计算销售额百分比=

╰+哭是因爲堅強的太久メ/ 2023年01月15日 03:48/ 0 赞/ 106 阅读

相关 js格式化金额

效果：￥9,980.00 export function formatMoney(val) { var valStr = String(Number(

快来打我*/ 2022年12月18日 14:55/ 0 赞/ 148 阅读

相关【前端】js实现金额数字格式化

方法一 abs = function(val){ //金额转换分->元保留2位小数并每隔3位用逗号分开 1,234.56

小鱼儿/ 2022年12月01日 05:13/ 0 赞/ 261 阅读

相关 200. 岛屿数量（JS实现）

1 题目 > 给你一个由 ‘1’（陆地）和 ‘0’（水）组成的的二维网格，请你计算网格中岛屿的数量。 > 岛屿总是被水包围，并且每座岛屿只能由水平方向或竖直方向上相邻

短命女/ 2022年11月25日 11:42/ 0 赞/ 128 阅读

相关 js 金额格式化

国内的会计记账法是保留两位小数，整数位每3个千位使用,号隔开 //s:传入的float数字，n:希望返回小数点几位 function fmoney(s, n)

小灰灰/ 2021年06月24日 13:59/ 0 赞/ 508 阅读