静态HTML网页可以实现购物车功能吗？而且不用数据库..._随笔

没有人会做这样的事情,但是即然说了,可以讨论一下一般的购物车,都要有SESSION和COOKIES来做,在没有服务端脚本语言的情况下 *** 作SESSION是不可能的!静态HTML里如果可以用JAVASCRIPT脚本,就可以 *** 作COOKIES,将商品的信息保存在COOKIES中,购买成功后,可以用:mailto:xxxx.net的方式发送到邮箱!

<!DOCTYPE html>

<html>

<head>

</head>

<body>

</div>

<div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div>

</div>

</div>

</div>

</div>

</div>

<div>移入收藏夹</div>

</div>

<div>

</div>

</div>

</div>

</div>

</div>

<div>移入收藏夹</div>

</div>

</body>

</html>

.container{

width: 1000px

margin-left: auto

margin-right: auto

color: #444444

}

.header{

margin: 8px

}

.shop-icon, .wangwang-icon, .promotion-icons span{

display:inline-block

width: 15px

height: 15px

background-color: rgb(117,192,241)

}

.promotion-icons span{

margin-right: 4px

}

.items{

border: 1px solid #ebe9e9

}

.item{

display: flex

margin: 8px

}

.item-img{

width:100px

height: 100px

display: inline-block

background-color: aquamarine

margin-left: 6px

margin-right: 6px

}

.item-name

{

display: flex

flex-direction: column

justify-content: space-between

}

.sku, .price,.item-price-total,.operation,.num-control{

margin-left: 18px

}

.num{

width: 18px

height: 15px

}

.num-control{

display: flex

align-items: baseline

}

.num-minus,.num-plus{

width: 18px

height: 22px

display: inline-block

background-color: #ebe9e9

}

.checkout{

display: flex

justify-content: space-between

}

.shop{

margin-bottom: 20px

margin-top: 30px

}

.goods,.freight,.checkout-button{

margin-left: 15px

}

.price-1{

text-decoration: line-through

color: gray

}

.check-num ,.total-price{

font-size: large

color: red

margin-left: 3px

margin-right: 3px

}

.checkout-button{

height: 30px

width: 50px

background-color: beige

}

.checkout{

margin-top: 15px

}

.item-name{

width: 25%

}

.item-price-total{

width: 5%

}

.sku{

width: 20%

}

function updatePrice(){

let items = document.querySelectorAll('.item')

let totalNum = 0

let totalPrice = 0

items.forEach(function(item){

if(item.querySelector('.item-checkbox').checked){

let num = item.querySelector('.num').value

totalNum = totalNum + parseInt(num)

let price = item.querySelector('.price-2').getAttribute('data-price')

totalPrice = totalPrice + parseFloat(price) * num

}

})

document.querySelector('.check-num').innerText= totalNum

document.querySelector('.total-price').innerText = totalPrice

}

window.onload=function(){

let itemCheckboxes = document.querySelectorAll('.item-checkbox')

itemCheckboxes.forEach(function(itemCheckbox){

itemCheckbox.onchange = function(){

updatePrice()

}

})

let minuses = document.querySelectorAll('.num-minus')

minuses.forEach(function(minus){

minus.onclick = function(event){

let num=minus.parentElement.querySelector('.num').value

if(parseInt(num)>1)

{

minus.parentElement.querySelector('.num').value=parseInt(num)-1

updatePrice()

}

})

let pluses = document.querySelectorAll('.num-plus')

pluses.forEach(function(plus){

plus.onclick = function(event){

let num=plus.parentElement.querySelector('.num').value

plus.parentElement.querySelector('.num').value=parseInt(num)+1

updatePrice()

}

})

}

eBay

eBay（EBAY，中文电子湾、亿贝、易贝）是一个管理可让全球民众上网买卖物品的线上拍卖及购物网站。ebay于1995年9月4日由Pierre Omidyar以Auctionweb的名称创立于加利福尼亚州圣荷西。人们可以在ebay上通过网络出售商品。

扩展资料：

经营方针是为来自各方的个人及小型公司提供一个买卖商品或服务的交易平台。至今，eBay 社群在全球各地已有超过一亿的注册会员！

来 eBay 买卖的朋友遍及全球！目前，eBay 已在许多国家设立了附属网站，包括澳洲、奥地利、比利时、加拿大、中国、法国、德国、香港、印度、爱尔兰、意大利、荷兰、纽西兰、新加坡、西班牙、瑞典、瑞士、台湾、英国，以及美国。此外，eBay 也透过投资於南韩的 Internet Auction 以及拉丁美洲的 MercadoLibre.com，将业务拓展至此两地。eBay 还在不断发展，希望为世界每个角落提供网络市集服务。

为了令会员能以轻松安全的方式，方便快捷在网上进行买卖，eBay 提供各式功能和服务，以及主题教室，包括：PayPal 网上付款系统、安全交易提示，以及供社群会员自行开发技术解决方案的「开发者方案」等等。

参考资料：百度百科：eBay

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/zaji/7872963.html

静态HTML网页可以实现购物车功能吗？而且不用数据库...

发表评论

评论列表（0条）