當用戶在上面的下拉列表中選擇某位用戶時,會執行名為 "showSite()" 的函數。該函數由 "onchange" 事件觸發:
test.html 文件代碼:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鳥教程(runoob.com)</title> <script>
function showSite(str){? ? if (str=="")? ? {? ? ? ? document.getElementById("txtHint").innerHTML="";
? ? ? ? return;
? ? }
? ? if (window.XMLHttpRequest)? ? {? ? ? ? // IE7+, Firefox, Chrome, Opera, Safari 瀏覽器執行代碼? ? ? ? xmlhttp=new XMLHttpRequest();
? ? }? ? else? ? {? ? ? ? // IE6, IE5 瀏覽器執行代碼? ? ? ? xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
? ? }? ? xmlhttp.onreadystatechange=function()? ? {? ? ? ? if (xmlhttp.readyState==4 && xmlhttp.status==200)? ? ? ? {? ? ? ? ? ? document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
? ? ? ? }? ? }? ? xmlhttp.open("GET","getsite_mysql.php?q="+str,true);
? ? xmlhttp.send();}
</script></head><body> <form><select name="users" onchange="showSite(this.value)"><option value="">選擇一個網站:</option><option value="1">Google</option><option value="2">淘寶</option><option value="3">菜鳥教程</option><option value="4">微博</option><option value="5">Facebook</option></select></form><br><div id="txtHint"><b>網站信息顯示在這里……</b></div> </body></html>