搜索文档
首页
HTML/CSS
JavaScript
服务端开发
Java教程
移动端
数据库
当前位置:
首页
JavaScript
AJAX 教程
AJAX 基础教程
源代码
清空
点击运行
<!DOCTYPE html> <html> <title>AJAX PHP 自动建议提示示例 - 基础教程(div.cn)</title> <head> <style> #result { color: #ec181e; font-weight: 900; } </style> </head> <body> <div> <p>在下面的输入字段中开始输入国家/地区名称:</p> <p>Country: <input type="text" onkeyup="showHint(this.value)"></p> <p>Suggestions: <span id="result"></span></p> </div> <script> var elem = document.getElementById("result"); function showHint(name) { if (name.length === 0) { elem.innerHTML = ""; return; } else { var httpRequest = new XMLHttpRequest(); httpRequest.onreadystatechange = function() { if (this.readyState === 4 && this.status === 200) { elem.innerHTML = this.responseText; } }; httpRequest.open("GET", "ajax_hint.php?q=" + name, true); httpRequest.send(); } } </script> </body> </html>
运行结果