Question

我使用下面的代码来读取XML文件并在同一屏幕上显示详细信息。

<!DOCTYPE HTML>
<html>
 <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script>
    $(document).ready(function () {
        $("#xmlButton").click(function() {
            var xmlName = $('input:file').val();
            $("#container").append("File Name:- " + xmlName);
            $.get(xmlName,printData);       
        });

        function printData(data) {
            $(data).find("name").each(function(){
                $("#container").append('<br/>'+$(this).text());
            })
        }
    });
 </script>
 </head>

 <body>
 <h1> Upload XML </h1>
 <form name="uploadForm" id="uploadForm" type="Get" action="" >
    <input type="file" name="xmlFile" id="xmlFile">
    <div id="container"></div>
    <p><input type="button" name="xmlButton" id="xmlButton" value="Upload"></p>
 </form>
</body>
</html>

我的XMl输入文件在

之下

 <root>
  <info>
    <name>name 1</name>
    <place>Place 1</place>
  </info>
  <info>
    <name>name 2</name>
    <place>Place 2</place>
  </info>
  <info>
    <name>name 3</name>
    <place>Place 3</place>
  </info>
</root>

以上代码在Mozilla Firefox 32中工作正常，它在Chrome 14版本中给出以下错误当我按上传按钮

XMLHttpRequest cannot load file:///C:/fakepath/test.xml. Cross origin requests are only supported for HTTP

在IE8中它只在控制台中显示文件名而没有错误信息。

还有其他方法可以让它在Chrome和IE中运行吗？我的主要目的是读取xml文件并在同一屏幕上打印它们。

Answer 1

好吧，出现此错误是因为您尝试对本地文件系统执行ajax调用。当您执行跨域请求（不在当前域中的请求）时，大多数浏览器将停止请求。您需要先上传提交表单，当文件在服务器上时，使用ajax加载。

另一种方法是使用HTML5，但您的浏览器需要支持它。 http://www.html5rocks.com/en/tutorials/file/dndfiles/

中的更多信息

在Javascript / jQuery中读取和显示XML内容

1 个答案: