使用Javascript/jQuery讀取和顯示XML內容

我正在使用下面的代碼來讀取XML文件並在同一屏幕上顯示它的詳細信息。使用Javascript/jQuery讀取和顯示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文件並將它們打印在同一屏幕上。

來源

2014-09-26 CFUser

嗯，這個錯誤是因爲你試圖爲你的本地文件系統做一個ajax調用。當您執行跨域請求（請求不在當前域中）時，大多數瀏覽器都會停止請求。您需要首先上傳表單，並在文件位於服務器上時，使用ajax加載。

另一種方式是使用HTML5，但您的瀏覽器需要支持它。更多資訊http://www.html5rocks.com/en/tutorials/file/dndfiles/

來源

2014-09-26 14:41:13

使用Javascript/jQuery讀取和顯示XML內容

回答

相關問題