当前位置:首页 » 网购平台 » js简单的购物车代码
扩展阅读
宁波奥德赛优惠价格 2021-03-15 14:26:02
丹尼斯购物卡能挂失么 2021-03-15 14:25:58
淘宝购物指纹验证失败 2021-03-15 14:24:44

js简单的购物车代码

发布时间: 2021-03-02 03:29:04

⑴ 求助js购物车代码!要能点击 添加按钮 就直接在购物车显示出来!可以修改数量!

<script language='javascript'>
function checkSum()
{
var sum = 0;
for(var i=0;i<document.form1.elements["writer"].length;i++)
{
if(document.form1.elements["writer"][i].checked)
{
sum = sum +parseInt(document.form1.elements["writer"][i].value);
}
}
totalprice.innerText = sum +" 元";
}
</script>
<form method=post name=form1>
<input type="checkbox" name=writer value="34" onclick="checkSum()">韩国耳饰(34元)<br>
<input type="checkbox" name=writer value="46" onclick="checkSum()">纯银吊坠tc34(46元)<br>
<input type="checkbox" name=writer value="30" onclick="checkSum()">黄莺手镯ta345(30元)<br>
<input type="checkbox" name=writer value="40" onclick="checkSum()">翡翠玉镯1346(40元)<br>
<input type="checkbox" name=writer value="50" onclick="checkSum()">天涯耳饰1233(50元)<br>
<br>
总价为:<span id="totalprice">0 元</span>
</form>

⑵ 有没有添加购物车的代码 JavaScript 或者jquery 的都可以

添加购物车需要和服务器端进行数据交互,前端主要是用js的ajax功能将产品的id或者其他信息提交给服务器端,然后等服务器端返回添加成功,再在页面上的购物车中增加添加的商品。

⑶ jsp购物车代码

//shopping.html
<html>
<head><title>shopping stor</title></head>
<body>
<form action="carts.jsp" target="post">
<br>
please select the item that you want to buy
<br>
<select name="item">
<option>book:old man and the sea
<option>x-box game machine
<option>mp3 player
<option>cce
<option>book:jsp programming
<option>cd "the endless love"
<option>dvd "gone with the wind"
</select>
<br>
<input type="submit" name="submit" value="add">
<input type="submit" name="submit" value="remove">
</form>
</body>

</html>
------------------------------------------------------------------
//carts.jsp
<%@page contentType="text/html;charset=ISO8859_1" %>
<html>
<jsp:useBean id="cart" scope="session" class="test.DummyCart"/>
<jsp:setProperty name="cart" property="*"/>

<%
cart.processRequest();
%>
<br>
<ol>
you have chosen these items:
<%
String []items=cart.getItems();
for(int i=0;i<items.length;i++)
{
%>
<li><%=items[i] %></li>
<%
}
%>
</ol>
<hr>
<%@include file="shopping.htm" %>

</html>
---------------------------------------------------------------------//DummyCart.java
package test;
import javax.servlet.http.*;
import java.util.Vector;
import java.util.Enumeration;
public class DummyCart
{
Vector v = new Vector();
String submit=null;
String item= null;
private void addItem(String name)
{
v.addElement(name);
}

private void removeItem(String name)
{
v.removeElement(name);
}

public void setItem(String s)
{
item=s;
}

public void setSubmit(String s)
{
submit=s;
}

public String[] getItems()
{
String []s=new String[v.size()];
v.Into(s);
return s;
}

public void processRequest()
{
if(submit==null)
addItem(item);
if(submit.equals("add"))
addItem(item);
else if (submit.equals("remove"))
removeItem(item);
reset();
}

private void reset()
{
submit=null;
item=null;
}

}

----------------------------------------------------------------------
上面是一个简单的例子,功能都能实现,对网页效果要求更漂亮些的可做一些修改。

⑷ 求一个JS代码,就APP购物车的代码,可以在html直接实现的

给楼主做了一个,JS实现商品计数的加和减,最少不能少于1,最多不大于99,代码里面有注释,方面楼主查看和使用。

⑸ 想做一个简单的购物车界面,非常简单就行有代码!用div+css做就可以

购物车外是可以的 但是核心最好还是用程序本来的核心如果自己写,很有单独

⑹ 用JavaScript代码模拟购物车。

购物车挺复杂的,不是一句两句能说清的,现在前端都用react,vue这类响应式框架做购物车,事半功倍。

⑺ 求html购物车代码,,效果如图显示

<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>修改订单</title>
<styletype="text/css">
body{
font-size:13px;
line-height:25px;
}
table{
border-top:1pxsolid#333;
border-left:1pxsolid#333;
width:400px;
}
td{
border-right:1pxsolid#333;
border-bottom:1pxsolid#333;
text-align:center;
}
.title{

font-weight:bold;
background-color:#cccccc;
}
inputtext{
width:100px;
}

</style>
<scripttype="text/javascript">
functionaddRow(){
//行的长度
varrowlength=document.getElementById("order").rows.length;
//得到整个表格对象
varorder=document.getElementById("order").insertRow(rowlength-1);
order.id=rowlength-1;
//插入列
varcel1=order.insertCell(0).innerHTML="游戏光盘";
varcel2=order.insertCell(1).innerHTML="34";
varcel3=order.insertCell(2).innerHTML="&yen;58.40";
varcel4=order.insertCell(3).innerHTML="<inputtype="button"value="删除"onclick="delRow('"+(rowlength-1)+"')"/>"+"<inputtype="button"value="修改"onclick="editRow('"+(rowlength-1)+"')"/>"
}
functiondelRow(qwe){
=document.getElementById(qwe).rowIndex;
document.getElementById("order").deleteRow(ewq);
}
functioneditRow(rowID){
varrow=document.getElementById(rowID);
varcel=row.cells;
vartext=cel[1].innerHTML;
cel[1].innerHTML="<inputtype='text'value='"+text+"'style='width:40px;'>"
cel[3].lastChild.value="确定";
cel[3].lastChild.setAttribute("onclick","update('"+rowID+"')");
}

functionupdate(qwe){
varrow=document.getElementById(qwe);
varcel=row.cells;
vartext=cel[1].lastChild.value;
cel[1].innerHTML=text;
cel[3].lastChild.value="修改";
cel[3].lastChild.setAttribute("onclick","editRow('"+qwe+"')");
}
/*

functionadd(){
vara=document.getElementById("order").rows.length;
varb=document.getElementById("order").insertRow(a-1);
varone1=b.insertCell(0).innerHTML="123";
}
*/
</script>
</head>
<body>
<tableborder="0"cellspacing="0"cellpadding="0"id="order">
<trclass="title">
<td>商品名称</td>
<td>数量</td>
<td>价格</td>
<td>操作</td>
</tr>
<trid="1">
<td>防滑真皮休闲鞋</td>
<td>12</td>
<td>&yen;568.50</td>
<td><inputname="rowdel"type="button"value="删除"onclick='delRow("1")'/>
<inputid="edit1"type="button"value="修改"onclick='editRow("1")'/></td>
</tr>
<tr>
<tdcolspan="4"style="height:30px;">
<inputname="addOrder"type="button"value="增加订单"onclick="addRow()"/></td>
</tr>
</table>
</body>
</html>

这个是我原来上学的时候练习的代码,练习的是基础的jsDOM操作,不过建议以后用Jquery 比较方便 有什么不懂得可以问我

⑻ 请问js购物车代码加在哪才能实现当顾客看到加入购物车的按钮,点击后出现弹出框呢

加在当前页面的<script>的一个方法中,你点击按钮触发这个方法就行

⑼ 在HTML里用javascript做一个简单购物车部分

给楼主做了一个,JS实现商品计数的加和减,最少不能少于1,最多不大于99,代码里面有注释,方面楼主查看和使用。

⑽ 求用javascript编写的简易购物车小程序如图所示:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MyHtml2.html</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<script>
/*
*@author Caoshun
*@计算 合计费用
*/
function countMethod(){
var num=document.getElementById("num").value;
var unitPrice=document.getElementById("unitPrice").value;
var freight=document.getElementById("freight").value;

document.getElementById("result").value=parseFloat((num*unitPrice))+parseFloat(freight);
}
</script>
</head>
<body>
<table border="1" cellpadding="1" cellspacing="1" background="#red" style="text-align: center;">
<tr><td colspan="5" align="center">简易购物车</td></tr>
<tr>
<td>商品名称</td>
<td>数量(件)</td>
<td>单价(美元)</td>
<td>运费(美元)</td>
<td><input type="button" value="合计" onclick="countMethod();"></td>
</tr>
<tr>
<td>跑跑道具</td>
<td><input type="text" size="6" id="num"></td>
<td><input type="text" size="6" id="unitPrice"></td>
<td><input type="text" size="6" id="freight"></td>
<td><input type="text" size="6" id="result"></td>
</tr>
</table>
</body>
</html>