Gemeinschaft Lernen Tools-Bibliothek Freizeit
suchen
Deutsch

AJAX与XML

AJAX与XML实例：

下面的实例将演示网页如何通过 AJAX 从 XML 文件读取信息：

                                             

本例由三部分组成

l  HTML表单页面

l  PHP页面

l  XML文件

HTML表单页面

当用户在上面的下拉列表中选择某张 CD 时，会执行名为 "showCD()" 的函数。该函数由 "onchange" 事件触发：

QQ截图20161009174933.png



用户选择下拉列表后。调用showCD()函数

ShowCD()函数执行以下步骤:

l  检查是否有 CD 被选择

l  创建 XMLHttpRequest 对象

l  创建在服务器响应就绪时执行的函数

l  向服务器上的文件发送请求

l  请注意添加到 URL 末端的参数（q）（包含下拉列表的内容）

PHP 文件

上面这段通过 JavaScript 调用的服务器页面是名为 "2.php" 的 PHP 文件。

PHP 脚本加载 XML 文档，"3.xml"，运行针对 XML 文件的查询，并以 HTML 返回结果：

QQ截图20161009174957.png


 

当 CD 查询从 JavaScript 发送到 PHP 页面时，将发生：

l  PHP 创建 “3.xml”文件的XML DOM 对象

l  循环所有 "artist" 元素 (nodetypes = 1)，查找与 JavaScript 所传数据向匹配的名字

l  找到 CD 包含的正确 artist

l  输出 album 的信息，并发送到 "txtHint" 占位符

XML文件

QQ截图20161009175012.png



该文件包含了有关CD收藏的数据

 


Weiter lernen
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> function showCD(str){ if(str==""){ document.getElementById("txt").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("txt").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","8_2.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <form> 选择一个CD： <select name="cds" onchange="showCD(this.value)"> <option value="Bob Dylan">Bob Dylan</option> <option value="Bonnie Tyler">Bonnie Tyler</option> <option value="Dolly Parton">Bonnie Tyler</option> </select> </form> </br> <div id="txt"><b>选择下拉列表，显示详细信息</b></div> </body> </html>
einreichenCode zurücksetzen
Vorherige Sektion nächsten Abschnitt
Tutorial-Liste
Hilfe bekommen
  • Kursempfehlungen
  • Kursunterlagen herunterladen
Die Kursunterlagen stehen derzeit nicht zum Download zur Verfügung. Die Mitarbeiter organisieren es derzeit. Bitte schenken Sie diesem Kurs in Zukunft mehr Aufmerksamkeit

Auch Studierende, die diesen Kurs gesehen haben, lernen

Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten)  492801 spielt ab