标签：style class blog code java http
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>下拉菜单</title> 6 <style type="text/css"> 7 .clrclass{ 8 height:50px; 9 width:50px; 10 float:left; 11 margin-right:30px; 12 } 13 #text{ 14 clear:left; 15 margin-top:50px; 16 } 17 </style> 18 </head> 19 20 <body> 21 22 <!----> 23 <script type="text/javascript"> 24 function changeColor(node){ 25 var colorVal = node.style.backgroundColor; 26 27 document.getElementById("text").style.color = colorVal; 28 } 29 </script> 30 31 <div class="clrclass" id="clr1" style="background-color:red" onclick="changeColor(this)"></div> 32 <div class="clrclass" id="clr2" style="background-color:green" onclick="changeColor(this)"></div> 33 <div class="clrclass" id="clr3" style="background-color:blue" onclick="changeColor(this)"></div> 34 <div id="text"> 35 曝热火欲招揽安东尼组四巨头<br/> 36 总决赛G4前瞻：斯波调整成比赛关键<br/> 37 骑士考察新秀恩比德 若背伤无碍就选他<br/> 38 </div> 39 40 <hr/> 41 42 <script type="text/javascript"> 43 function changeColor2(node){ 44 45 var oSelectNode = document.getElementsByName("selectColor")[0]; 46 47 //获取所有的option 48 var colorVal = oSelectNode.options[oSelectNode.selectedIndex].value; 49 50 document.getElementById("text").style.color =colorVal; 51 52 } 53 </script> 54 <select name="selectColor" onchange="changeColor2(this)"> 55 <option value="black">--选择颜色--</option> 56 <option value="red">红色</option> 57 <option value="green">绿色</option> 58 <option value="blue">蓝色</option> 59 </select> 60 <select name="selectColor2" onchange="changeColor2(this)" class="selClass"> 61 <option style="background-color:black" value="black">--选择颜色--</option> 62 <option style="background-color:red" value="red">红色</option> 63 <option style="background-color:green" value="green">绿色</option> 64 <option style="background-color:blue" value="blue">蓝色</option> 65 </select> 66 </body> 67 </html>
标签：style class blog code java http
原文地址：http://www.cnblogs.com/aineko/p/3784731.html
