购物车还有加减按钮，也是将标签内容的数字加一减一就行了
数字的改变需要用到 js 或者其他js框架来进行 *** 作
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html charset=gb2312" />
<title>修改订单</title>
<style type="text/css">
body{
font-size:13px
line-height:25px
}
table{
border-top: 1px solid #333
border-left: 1px solid #333
width:400px
}
td{
border-right: 1px solid #333
border-bottom: 1px solid #333
text-align:center
}
.title{
font-weight:bold
background-color: #cccccc
}
input text{
width:100px
}
</style>
<script type="text/javascript">
function addRow(){
//行的长度
var rowlength=document.getElementById("order").rows.length
//得到整个表格对象
var order = document.getElementById("order").insertRow(rowlength-1)
order.id=rowlength-1
//插入列
var cel1=order.insertCell(0).innerHTML="游戏光盘"
var cel2=order.insertCell(1).innerHTML="34"
var cel3=order.insertCell(2).innerHTML="¥58.40"
var cel4=order.insertCell(3).innerHTML="<input type=\"button\"value=\"删除\" onclick=\"delRow('"+(rowlength-1)+"')\"/>"+ "<input type=\"button\"value=\"修改\" onclick=\"editRow('"+(rowlength-1)+"')\"/>"
}
function delRow(qwe){
var ewq=document.getElementById(qwe).rowIndex
document.getElementById("order").deleteRow(ewq)
}
function editRow(rowID){
var row=document.getElementById(rowID)
var cel=row.cells
var text=cel[1].innerHTML
cel[1].innerHTML="<input type='text' value='"+text+"' style='width:40px'>"
cel[3].lastChild.value="确定"
cel[3].lastChild.setAttribute("onclick","update('"+rowID+"')")
}
function update(qwe){
var row=document.getElementById(qwe)
var cel=row.cells
var text=cel[1].lastChild.value
cel[1].innerHTML=text
cel[3].lastChild.value="修改"
cel[3].lastChild.setAttribute("onclick","editRow('"+qwe+"')")
}
/*
function add(){
var a = document.getElementById("order").rows.length
var b = document.getElementById("order").insertRow(a-1)
var one1 = b.insertCell(0).innerHTML="123"
}
*/
</script>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0" id="order">
<tr class="title">
<td>商品名称</td>
<td>数量</td>
<td>价格</td>
<td> *** 作</td>
</tr>
<tr id="1">
<td>防滑真皮休闲鞋</td>
<td>12</td>
<td>¥568.50</td>
<td><input name="rowdel" type="button" value="删除" onclick='delRow("1")' />
<input id="edit1" type="button" value="修改" onclick='editRow("1")' /></td>
</tr>
<tr>
<td colspan="4" style="height:30px">
<input name="addOrder" type="button" value="增加订单" onclick="addRow()" /></td>
</tr>
</table>
</body>
</html>
这个是我原来上学的时候练习的代码，练习的是基础的jsDOM *** 作，不过建议以后用Jquery 比较方便 有什么不懂得可以问我
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）