商品不同价格js效果(求用JavaScript代码写出如下图片页面效果,可以实现商品加数量的总价结算,万分感谢)

本文目录
- 求用JavaScript代码写出如下图片页面效果,可以实现商品加数量的总价结算,万分感谢
- 商品信息对比的js代码应该怎么写类似于这个网站的http://tech.sina.com.cn/notebook/search.html
- 急!急!急!文本框里面输入一个数字,旁边显示出计算的价格,用js做怎么写啊,高手指教!~~!
- js实现商品规格改变时,相应价格改变,类似于淘宝
- JQuery或JS实现商品加入对比的代码
- 用js实现商品购买数量越多,商品单价越低,并计算总价
- 用javascript怎么一次计算多个商品总价
- 前端页面编程,js.不同的选项,怎么出现不同的价格
求用JavaScript代码写出如下图片页面效果,可以实现商品加数量的总价结算,万分感谢
这边百度了一段代码,请保存为.html文件修改测试,供参考。
《!DOCTYPE html》
《html》
《head》
《meta charset="UTF-8"》
《title》《/title》
《style》
em{
font-style: normal;
}
ul li{
list-style: none;
}
《/style》
《/head》
《body》
《ul id="list"》
《li》
《input type="槐巧button" value="-" /》
《strong》0《/strong》
《input type="button" value="+" /》
单价:《em》10元《/em》
总计:《span》0元《/span》
《/li》
《li》
《input type="button" value="-" /》
《strong》0《/strong》
《input type="button" value="+" /》
单价:《em》9元《/em》
总计:《span》春段0元《/span》
《/li》
《li》
《input type="button" value="-" /》
《strong》0《/strong》
《input type="button" value="+" /》
单价:《em》90元《/em》
总计:《span》0元《/span》
《/li》
《/ul》
《p》商品数量总计:0件《/p》
《p》共消费:0元《/p》
《p》商品最贵的是:0元《/p》
《script》
var oList = document.getElementById("list")
var aLi = oList.getElementsByTagName("li")
var oStrong = oList.getElementsByTagName("strong")
var oP = document.getElementsByTagName("p")
var oSpan = document.getElementsByTagName("span")
for (var i=0;i《aLi.length;i++) {
tab(i)
}
//商品的添加与移除
function tab(a){
var oInput = aLi.getElementsByTagName("input")
var oStrong = aLi
var oEm = aLi
var oSpan = aLi
var num = 0
oInput.onclick = function(){
num++
oStrong.innerHTML = num
var oPrice = parseFloat(oEm.innerHTML)
oSpan.innerHTML = parseFloat(num)*oPrice+"元"
var addShop = count()
// console.log(addShop)
oP.innerHTML = "商品数量总计:"+addShop+"件"
var all = all_price()
oP.innerHTML = "共消费:"+all+"元"
var max = compare()
// console.log(max)
oP.innerHTML = "商品最贵的是:"+max+"元"
}
oInput.onclick = function(){
num--
if(num《=0){
num = 0
}
oStrong.innerHTML = num
var oPrice = parseFloat(oEm.innerHTML)
oSpan.innerHTML = parseFloat(num)*oPrice+"元"扒明誉
var addShop = count()
// console.log(addShop)
oP.innerHTML = "商品数量总计:"+addShop+"件"
var all = all_price()
oP.innerHTML = "共消费:"+all+"元"
}
}
//商品数量求和
function count(){
var sum = 0
for (var i=0;i《oStrong.length;i++) {
sum+=parseFloat(oStrong.innerHTML)
}
// console.log(sum)
return sum
}
//消费总计
function all_price(){
var sum = 0
for (var i=0;i《oSpan.length;i++) {
sum+=parseFloat(oSpan.innerHTML)
}
// console.log(sum)
return sum
}
//比较最大值
function compare(){
var arr =
for (var i=0;i《oSpan.length;i++) {
arr.push(parseFloat(oSpan.innerHTML))
}
arr.sort(function(a,b){
return b-a
})
return arr
}
《/script》
《/body》
《/html》
商品信息对比的js代码应该怎么写类似于这个网站的http://tech.sina.com.cn/notebook/search.html
可以创建一个对象,如
function Goods(id,name,other...){
this.id=id,
this.name=name
.......
}
也可以用亮友这种方式添加一个属性
Goods.prototype.id=’’
在对比的时候每添加一个对比物品,可以var goods1= new Goods() 一下,然后对goods1的各个属性进行赋值,然后对每个对象隐键模进行按着不同灶缓的属性进行对比,你可以按着这个思路试试看看
急!急!急!文本框里面输入一个数字,旁边显示出计算的价格,用js做怎么写啊,高手指教!~~!
从《select id="stplc" 》
《option value="美国" 》美国《/option》
《option value="英国"》英国《/option》
《option value="中国"》中国《/蚂颤option》
《/select》
到
《select id="aimplc" 》
《option value="桐含美国" 》美国《/option》
《option value="英国"》英国《/option》
《option value="中国" selected》中国《/option》
《/select》
《select id="sort" 》
《option value="A" 》A类商品《/option》
《option value="B"》B类商品《/option》
《option value="C" 》C类商品《/option》
《/select》
《select id="unt" 》
《option value="0" 》磅《/option》
《option value="1"》公斤《/option》
《/select》局物笑
《!--查询按钮也可以换成图片》
《input type="button" value="查询" onclick="calcu()"》
《input type="textbox" id="result" value="" onclick="calcu()" size=40》
《script language="javascript"》
function calcu(){
document.getElementById("result").value="不知道怎么算什么,没法写代码,这儿是结果"
}
《/script》
js实现商品规格改变时,相应价格改变,类似于淘宝
document.getElementById("realprice").innerHTML=’59’;
JQuery或JS实现商品加入对比的代码
如果是用cookie记录的话,在显示的页面应该是有个定时器不断的读取cookie然后更新页面的,也就是说cookie的写(世稿兆更新)操作敬碰是要等用户做了某个操作之后触发的,比如添加、删除,而读是在有对比栏呈现的时候(不搜租管是新开页面还是一个弹出层的形式)定时读取然后更新UI即可,总之,纯js实现的话定时器是必须的
用js实现商品购买数量越多,商品单价越低,并计算总价
伪代码:
这里假携早设 商品购买量为 a, 商品单价为b, b和a的关系为b=a*x, 商品总价为S, 则
if (a《=100){S=a*b}
if (a》100 && a《=200){S=a*b}
function(a){
if(a《=100)
b = 300;
if(a》100 && a《=200)
b = 270;
return b;
}
以此类推
伪代宽雹码:这里假设 商品慎隐帆购买量为 a, 商品单价为b, b和a的关系为b=a*x, 商品总价为S, 则if (a《=100){S=a*b}if (a》100 && a《=200){S=a*b}function(a){if(a《=100)b = 300;if(a》100 && a《=200)b = 270;return b;}以此类推
用javascript怎么一次计算多个商品总价
是要乎链多个值相加求和么? 举个例子:两个值相加,第一个值的id定为fId、第二个值的id定为sId。JavaScript中写个方法
《JavaScript...》
function sum(){
var id1=document.getElementById("fId").value;
var id2=document.getElementById("sId").value;
//两个值相加即可,注意转换为double型的
}
《/JavaScript》岁历孙
然后jsp下面在调用这个方法就好了 在哪烂磨调用就是你的事了
前端页面编程,js.不同的选项,怎么出现不同的价格
把茄悉尼龙脚的价格都通过属性data-price=“” 加到颜色所在div上芹孙,然后点颜色时,根据所选脚材嫌纳链质来显示
var price;
if type=’尼龙脚’
price=this.getAttribute("data-price");
else
price=this.getAttribute("data-price")+20;

更多文章:
androidapp源码免费下载(如何实现APK的反编译得到APK的源码)
2026年9月22日 18:00
service pack 3(操作系统版本升级(SP) Service Pack 3当中的“Service Pack 3”是什么意思)
2026年9月22日 10:20
html代码怎么写大佬教程(html网页的题来个大佬,写代码,题目在图上)
2026年9月22日 10:10
结构体内又一个struct(c++ 在结构体中再嵌入一个结构体如何调用)
2026年9月22日 09:40
cocos creator中文(cocoscreator和cocoscreator3d的区别)
2026年9月22日 02:30





