❶ 靜態HTML網頁可以實現購物車功能嗎而且不用資料庫...
沒有人會做這樣的事情,但是即然說了,可以討論一下一般的購物車 ,都要有SESSION和COOKIES來做回,在沒有服務端答腳本語言的情況下操作SESSION是不可能的! 靜態HTML里如果可以用JAVASCRIPT腳本,就可以操作COOKIES,將商品的信息保存在COOKIES中,購買成功後,可以用:mailto:xxxx.net的方式發送到郵箱!
❷ javascript+jsp實現在1.html把商品放購物車,在2.html顯示購物車內的信息.看問題補充
不建議用cookie, 不安全,而且瀏覽器可能禁止cookie
還是把購買信息保存到伺服器session中, 在2.html顯示
❸ 網頁製作中像電商購物車中的商品數量改變是怎麼做的
這個用javascript實現啊.貌似不難啊
❹ 如何用html css javascript php製作購物車
一兩句說不清楚………
用html css做出商品樣子和購物車樣子，
然後用javascript來對買這個動專作做處理，把商品的信屬息存起來，通過js把商品信息傳遞給購物車，讓購物車能夠顯示；
另一方面把信息交給php，寫入資料庫。
我這么說你明白了么……
❺ 淺析電商網站的購物車頁面如何做好優化
一、放入購物車按鈕必須十分明顯
建議一：「放入購物車」按鈕必須十分明顯。如果在不破壞頁面均衡美觀的前提下，「放入購物車」盡量使用顏色突出的大按鈕，如果是白底黑字，按鈕可以用紅色、黃色等比較有視覺沖擊力的顏色。另外，購物車一定要讓用戶第一眼就看見，當用戶閱讀完產品信息想購買時，一定要讓用戶做到不必尋找購物車按鈕而是直接打開頁面後就可以看到購物車按鈕。
二、購物車按鈕文字
建議二：購物車按鈕文字。對於購物車的按鈕文字是可以千奇百變的，想用什麼文字就用什麼文字，但要注意這些文字一定要符合用戶體驗和起到轉化率的作用。我們可以通過一些文字來做個實驗，看看哪些文字的轉化率是最高的，哪些文字的轉化率是最低的。比如放入購物車、立即購買、購買、立即節省xx元。加入購物車、輕松購等，這些都可以嘗試的去使用。
三、隨時放入購物車
建議三：隨時放入購物車。主要意思的是網站上應該有個方便用戶隨時把產品放入購物車的文字按鈕，可以在產品介紹頁面的最上端，如價格、型號、產品名稱等，可以簡要說明的旁邊放上購物車的按鈕，還可以在產品的描述結束後再次顯示購物車按鈕。
四、編輯購物車
建議四：編輯購物車。購物車一定要允許用戶隨時隨地的編輯購物車內容和修改要購買產品的數量。如果產品還有顏色、尺寸等，也應該允許用戶在購物車內直接進行編輯，而不是刪除產品重新去選擇產品的顏色、尺寸等放入購物車。目前的購物車都可以做到這個功能，所以就不多說了。
五、隨時隨地查看購物車內容
建議五：隨時隨地查看購物車內容。很多用戶都喜歡在任何地方、任何頁面上清楚的看到購物車內容，如果看不到購物車的內容，很多用戶都會擔心產品購買失敗或重新購買等。目前很多電商網站都是用戶主動點擊購物車鏈接才能看到購物車中已經有的哪些產品，這種方式沒有用戶體驗，也給用戶增加了一個完全沒有必要的點擊步驟
六、付款進程指示
建議六：付款流程指示。用戶在確認訂單後並完成付款的過程中，頁面應該清楚的顯示這個幾個步驟，比如檢查購物車內容、注冊或登陸帳號、確認訂單、付款、購買完成等文字，並且通過箭頭或不同顏色的字體顯示出用戶現在處於哪個一個步驟，讓用戶對接下來所需要完成的步驟和需要的時間有個心理預期。
❻ 用html做一個購物車，能實現簡單的產品數量和價格的加減就行。最後能計算出提交物品價格的總和。
html中的購物車的增減不能直接傳送到後台，可以通過ajax，在js中發送ajax
純前端的話可以參考下面的
<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>cart</title>
<styletype="text/css">
body,p,a,input{
margin:0;
padding:0;
font-size:12px;
}
.container{
width:100%;
}
.main{
width:1000px;
height:500px;
margin:100pxauto;
}
.main.cart-containertable{
width:100%;}
.main.cart-containertabletr{
text-align:center;
}
.main.cart-containertabletr:hover{
background:rgba(128,128,128,0.2);
}
.main.cart-containertable.table-header{
height:30px;
background:#d9d9d9;
font-size:1.2em;
}
.main.cart-containertable.table-headertd:first-child{
border-left:solid4pxred;
box-sizing:border-box;
}
.main.cart-containertabletrtd:nth-child(1),
.main.cart-containertabletrtd:nth-child(2){
text-align:left;
}
.main.cart-containertabletrtd:nth-child(2){
width:52%;
}
.main.cart-containertabletrtd:nth-child(3){
width:12%;
}
.main.cart-containertabletrtd:nth-child(4){
width:12%;
}
.main.cart-containertabletrtd:nth-child(5){
width:12%;
}
.main.cart-containertabletrtd:last-child{
width:10%;
}
.cart-good{
height:60px;
}
.cart-goodimg{
float:left;
margin:10px;
width:60px;
}
.cart-goodtdp{
margin:10px0px;
}
/*加、減按鈕*/
.cart-goodtdinput[type='button']{
width:20px;
height:20px;
background:#00f300;
outline:none;
border:none;
}
.cart-goodtdinput[type='button']:disabled{
background:grey;
}
.cart-goodtdinput[type='button']:first-child{
margin-right:-4px;
}
.cart-goodtdinput[type='button']:last-child{
margin-left:-4px;
}
.cart-goodtdinput[type='text']{
width:30px;
height:20px;
outline:none;
border:none;
text-align:center;
}
.table-footer{
display:flex;
justify-content:space-between;
line-height:40px;
}
.table-footerdiv{
font-size:1.2em;
}
.table-footerdivbutton{
background:red;
width:120px;
height:40px;
color:white;
}
</style>
</head>
<body>
<divclass="container">
<header></header>
<sectionclass="main">
<divclass="cart-container">
<tablecellspacing="0">
<trclass="table-header">
<td><inputtype="checkbox"id="chk_alla"></td>
<td>聚美優品發貨</td>
<td>聚美價</td>
<td>數量</td>
<td>小計</td>
<td>操作</td>
</tr>
<!--<trclass="cart-good">-->
<!--<td><inputtype="checkbox"id="001"></td>-->
<!--<td>-->
<!--<imgsrc="https://p2.jmstatic.com/proct/001/293/1293263_std/1293263_60_60.jpg"alt="">-->
<!--<p>[極速免稅]PITTAMASK口罩3枚入</p>-->
<!--<p>型號：新版防曬款容量：3枚入</p>-->
<!--</td>-->
<!--<td>89.00</td>-->
<!--<td>-->
<!--<inputtype="button"value="-">-->
<!--<inputtype="text"value="1">-->
<!--<inputtype="button"value="+">-->
<!--</td>-->
<!--<td>89.00</td>-->
<!--<td><ahref="#">刪除</a></td>-->
<!--</tr>-->
</table>
<divclass="table-footer">
<div>
<inputtype="checkbox"id="chk_allb"><labelfor="chk_allb">全選</label>
<spanstyle="margin-left:20px">繼續購物|清空選中商品</span>
</div>
<div>
共<spanid="good_count">5</span>件商品商品應付總額：<spanid="goods_total">¥229.00</span>
<buttonclass="btn_menu">去結算</button>
</div>
</div>
</div>
</section>
</div>
<script>
(function(){
varskin_procts=[
{
"id":"002",
"title":"EsteeLauder多效智妍精華霜15ml",
"img_url":"http://p0.jmstatic.com/proct/003/565/3565880_std/3565880_350_350.jpg",
"price":249.0,
"number":6,
"acount":"520",
"ischecked":true
},
{
"id":"004",
"title":"EsteeLauder肌透修護潔面乳30ml",
"img_url":"http://p4.jmstatic.com/proct/003/155/3155764_std/3155764_350_350.jpg",
"price":49.9,
"number":1,
"acount":"5911",
"ischecked":false
},
{
"id":"008",
"title":"雅詩蘭黛無痕持妝粉底液",
"img_url":"http://p3.jmstatic.com/proct/003/662/3662318_std/3662318_350_350.jpg",
"price":69.9,
"number":2,
"acount":"3972",
"ischecked":true
},
{
"id":"0012",
"title":"EsteeLauder肌初賦活原生液30ml",
"img_url":"http://p4.jmstatic.com/proct/003/565/3565914_std/3565914_350_350.jpg",
"price":159.0,
"number":1,
"acount":"2338"
},
{
"id":"001",
"title":"雅詩蘭黛無痕持妝粉底液30ml",
"img_url":"http://p2.jmstatic.com/proct/001/648/1648502_std/1648502_350_350.jpg",
"price":298.0,
"number":4,
"acount":"5071",
"ischecked":false
},
{
"id":"009",
"title":"雅詩蘭黛眼部精華霜15ml",
"img_url":"http://p1.jmstatic.com/proct/001/049/1049746_std/1049746_350_350.jpg",
"price":399.0,
"number":1,
"acount":"4022",
"ischecked":false
}
]
//添加商品
functionload(){
vartbody=document.querySelector('.cart-containertabletbody');
for(letgoodofskin_procts){
tbody.innerHTML+=`<trclass="cart-good"id="${good.id}">
<td><inputtype="checkbox"class="good-check"${good.ischecked?"checked":''}></td>
<td>
<imgsrc="${good.img_url}"alt="">
<p>[極速免稅]PITTAMASK口罩3枚入</p>
<p>型號：新版防曬款容量：3枚入</p>
</td>
<td>${good.price}</td>
<td>
<inputtype="button"value="-"${good.number<=1?"disabled":''}>
<inputtype="text"value="${good.number}">
<inputtype="button"value="+">
</td>
<td>${good.price*good.number}</td>
<td><ahref="#">刪除</a></td>
</tr>`
}
totalAcount();
}
load();
//endall..........
//1.為table注冊單擊事件
vartable01=document.querySelector('.cart-containertable');
table01.onclick=function(event){
varnode=event.target
if(node.getAttribute('type')=='button'){
//alert(event.target.value);
changeNumber(event);
subtotal(event);
checkedRow(event);
checkedAllRows();
}elseif(node.className=='good-check'){
checkedAllRows();
}elseif(node.id=='chk_alla'){
varf=event.target.checked;
varchks=document.querySelectorAll('.good-check');
for(varckofchks){
ck.checked=f;
}
for(vargoodofskin_procts){
good.ischecked=f;
}
}elseif(node.nodeName.toLowerCase()=='a'){
vartr=event.target.parentNode.parentNode;
for(vari=0;i<skin_procts.length;i++){
if(skin_procts[i].id==tr.id){
skin_procts.splice(i,1);
console.log(skin_procts);
}
}
tr.parentNode.removeChild(tr);
}
totalAcount();
};
//單擊增加或減少按鈕的方法
functionchangeNumber(event){
varnode=event&&event.target;
varv=0;
if(node.value&&node.value=='+'){
//node.previousElementSibling.value=parseInt(node.previousElementSibling.value)+1;
node.previousElementSibling.value++;
v=node.previousElementSibling.value;
node.previousElementSibling.previousElementSibling.disabled=false;
}else{
//if(node.value&&node.value=='+')
if(node.nextElementSibling.value>1){
node.nextElementSibling.value--;
v=node.nextElementSibling.value;
if(v==1){
node.disabled=true;
}
}
}
//存儲商品數量
varid=node.parentNode.parentNode.id;
for(vargoodofskin_procts){
if(id==good.id){
good.number=v;
}
}
}
//每個商品小計的方法
functionsubtotal(event){
varnode=event&&event.target;
//varid=node.parentNode.parentNode.id;
//for(vargofskin_procts){
//if(g.id==id){
//alert(g.price);
//}
//}
//varprice=；
varprice=node.parentNode.previousElementSibling.innerText;
varnum=node.parentNode.children[1].value;
node.parentNode.nextElementSibling.innerText=(num*price).toFixed(2);
}
//檢驗該商品是否選中
functioncheckedRow(event){
event.target.parentNode.parentNode.firstElementChild.firstElementChild.checked=true;
//event.target.parentNode.parentNode.cells[0].firstElementChild.checked=true;
//vartbody=event.target.parentNode.parentNode.parentNode;
//event.target.parentNode.parentNode.parentNode.rows[3].cells[0].firstElementChild.checked=true;
}
//檢查是否全選
functioncheckedAllRows(){
varchks=document.querySelectorAll('.good-check');
varflag=true;
for(varckofchks){
if(!ck.checked){
flag=false;
break;
}
}
document.querySelector('#chk_alla').checked=flag;
}
//統計商品總量和總價格
functiontotalAcount(){
vartotal=0;
vartotal_price=0;
varchks=document.querySelectorAll('.good-check');
for(varckofchks){
if(ck.checked){
id=ck.parentNode.parentNode.id;
for(vargoodofskin_procts){
if(id==good.id){
total+=~~good.number;
total_price=total_price+(good.number*good.price);
good.ischecked=true;
}
}
}
}
document.querySelector('#good_count').innerText=total;
document.querySelector('#goods_total').innerText=total_price;
}
})();
</script>
</body>
</html>
❼ 求一個HTML商務型網站模板，購物類型的，擁有購物車功能的
沒有，找了很久了，只有單獨的JS購物車系統，其他頁面和功能需要自己寫。
❽ 電商的購物車怎麼實現的
直接點擊購物就可以了。現在都在賽客十六福網上購物商城購物，
❾ 我想新建一個網頁，關於電子商務的，要有購物車、物流、支付什麼的，怎麼建有好的軟體嗎最好是免費的
網站設計的話，最簡單就是dreamweaver啊，網上搜一個序列號，然後安裝就好了啊，網上搜一下專就可以下載，購物車那些屬是程序，你設置就有啊，不過看你網站設計的水平來定你做的出來的網站，那個，冒昧問一下，你也是學網站設計的么，話說為什麼你作業是設計這個這么單調的啊？還是說，你是學營銷類的？
❿ html, 製作電商網站的一般流程問題
我們公司就來是做網路商城的，商自品添加購物車實際就是添加到資料庫了。
正常情況下，前端做的數據處理本質只是讓用戶看的，你F12改一下就可能會導致傳到後台的數據出問題。
我們公司的做法是後台也進行判斷，當提交給後台的時候，後台要判斷商品的單價和數量，例如庫存是否足夠，價格是否正確，防止出現問題。