标签:utf-8 blog node ref document meta conf 城市 win
1.删除功能:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>删除功能</title> <script type="text/javascript"> function delTr(id){ var trObj = document.getElementById(id); if(window.confirm("主公,三思啊!!!")){ trObj.parentNode.removeChild(trObj); } } function changeColor_over(trObj){ trObj.style.backgroundColor = "#ccc"; } function changeColor_out(trObj){ trObj.style.backgroundColor = "#fff"; } </script> </head> <body> <table width="600" border="1" align="center"> <caption><h2>购物车清单</h2></caption> <tr> <th>商品名</th> <th>单价</th> <th>数量</th> <th>功能</th> </tr> <tr id="list_01" onmouseover="changeColor_over(this)" onmouseout="changeColor_out(this)"> <td>1.三体(全三册)</td> <td align="center">¥45.00</td> <td align="center">1</td> <td align="center"><a href="javascript:void(0)" onclick="delTr(‘list_01‘)">删除</a></td> </tr> <tr id="list_02" onmouseover="changeColor_over(this)" onmouseout="changeColor_out(this)"> <td>2.解忧杂货店</td> <td align="center">¥28.00</td> <td align="center">1</td> <td align="center"><a href="javascript:void(0)" onclick="delTr(‘list_02‘)">删除</a></td> </tr> <tr id="list_03" onmouseover="changeColor_over(this)" onmouseout="changeColor_out(this)"> <td>3.人类简史:从动物到上帝</td> <td align="center">¥45.00</td> <td align="center">1</td> <td align="center"><a href="javascript:void(0)" onclick="delTr(‘list_03‘)">删除</a></td> </tr> </table> </body> </html>
2.二级联动:三级联动还没想出来
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>多级联动菜单</title> <script type="text/javascript"> arr_province = ["请选择省份","北京市","广东省","湖南省"]; arr_city = [ ["请选择城市"], ["海淀区","宣武区","朝阳区","房山区"], ["广州市","深圳市","清远市","罗定市"], ["长沙市","常德市","岳阳市","永州市"], ]; arr_area = [ ["请选择地区"], [["中关村","北理工"],["宣区","武区"],["朝区","阳区"],["房山","良乡"]] ] window.onload = function(){ //在省份下拉列表中写入省份数组 var province = document.form1.province; var city = document.form1.city; var area = document.form1.area; province.length = arr_province.length; for(var i=0; i<province.length; i++){ province.options[i].text = arr_province[i]; province.options[i].value = arr_province[i]; } province.selectedIndex = 0; var index = province.selectedIndex; //在省份下拉列表中写入城市数组 city.length = arr_city[index].length; for(var j=0; j<city.length; j++){ city.options[j].text = arr_city[index][j]; city.options[j].value = arr_city[index][j]; } } function changeSelected(changedIndex){ var city = document.form1.city; city.length = arr_city[changedIndex].length; for(var k=0; k<city.length; k++){ city.options[k].text = arr_city[changedIndex][k]; city.options[k].value = arr_city[changedIndex][k]; } } </script> </head> <body> <form name="form1" method="post"> 省份:<select name="province" onchange="changeSelected(this.selectedIndex)"></select> 城市:<select name="city"></select> 地区:<select name="area"></select> </form> </body> </html>
标签:utf-8 blog node ref document meta conf 城市 win
原文地址:http://www.cnblogs.com/panbee/p/6160848.html