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 <title>获取或设置元素的值</title> 5 <script type="text/javascript" 6 src="Jscript/jquery-1.8.2.min.js"> 7 </script> 8 <style type="text/css"> 9 body{font-size:12px;text-align:center} 10 div{padding:3px;margin:3px;120px;float:left} 11 .txt{border:#666 1px solid;padding:3px} 12 </style> 13 <script type="text/javascript"> 14 $(function() { 15 $("select").change(function() { //设置下拉列表框change事件 16 var strSel = $("select").val().join(","); //获取下拉列表框所选中全部选项值 17 $("#p1").html(strSel); //显示下拉列表框所选中全部选项值 18 }) 19 $("input").change(function() { //设置文本框focus事件 20 var strTxt = $("input").val(); //获取文本框的值 21 $("#p2").html(strTxt); //显示文本框所输入的值 22 }) 23 $("input").focus(function() { //设置文本框focus事件 24 $("input").val(""); //清空文本框的值 25 }) 26 }) 27 </script> 28 </head> 29 <body> 30 <div> 31 <select multiple="multiple" style="height:96px;85px"> 32 <option value="1">Item 1</option> 33 <option value="2">Item 2</option> 34 <option value="3">Item 3</option> 35 <option value="4">Item 4</option> 36 <option value="5">Item 5</option> 37 <option value="6">Item 6</option> 38 </select> 39 </div> 40 <div> 41 <input type="text" class="txt" id="p1"/> 42 <p id="p2"></p> 43 </div> 44 </body> 45 </html>