|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www./TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www./1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js表單文本框內(nèi)容互換代碼 - </title> </head>
<body>
<script type="text/javascript"> function change(){
var num1 = document.getElementById("num1").value; var num2 = document.getElementById("num2").value; { document.getElementById("num2").value = num1; document.getElementById("num1").value = num2; } } </script>
<style type="text/css"> body{ font-family: "Microsoft YaHei";font-size: 14px;line-height: 28px;}
input { width: 217px; height: 28px; padding-left: 6px; border-color: #BBB #DDD #DDD #BBB; box-shadow: 1px 1px 1px #DDD inset; line-height: 28px; padding: 0 5px; border: 1px solid #ccc; font-size: 12px; outline: medium none; font-size: 12px; outline: none;
} .huan{ border-radius: 15px; width: 28px; height: 28px; background: url(images/h.png); border: 1px solid #ccc; box-shadow: 0px 0px 0px #fff inset;}
.huan:hover{ box-shadow: 1px 1px 1px #DDD inset;}
</style>
<p> </p> <p> </p> <p> </p> <p> </p> <table width="50%" border="0" align="center" cellpadding="0" cellspacing="0"> <tbody> <tr> <td align="center">出發(fā)城市</td> <td align="center"><input type="text" name="num1" id="num1" value="西安(SIA)"></td> <td align="center"><input type="button" onClick="change()" class="huan" value=""></td> <td align="center">到達(dá)城市</td> <td align="center"><input type="text" name="num2" id="num2" value="北京(BJS)"></td> </tr> </tbody> </table>
<p style="text-align: center">點(diǎn)擊中間的切換按鈕，城市內(nèi)容互換</p>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"> <p>適用瀏覽器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p> <p>來源：<a href="http://www./" target="_blank"> </a></p> </div> </body> </html> |
|
|
