2011-01-20 78 views
0

我需要将一个xml文件加载到html5页面中,用户现在可以编辑此文件,之后我需要再次保存它。如何在HTML5中加载,编辑和保存XML文件

我在网上找了几天找不到合适的东西...我发现很多教程如何加载和解析JavaScript的XML文件,但我不知道如何保存这些。 Javascript是这个错误的答案。

编辑:JavaScript的可能是这个问题

回答

0

Downloadify是一个很小的JavaScript + Flash库,使上飞文件的生成和保存,在浏览器中错误的解决方法,而无需服务器交互。

+2

好,一晃就是没有去。我需要为这个项目使用html5技术 – boris 2011-01-20 13:11:27

0

这是相当古老的,但我想我会回答它,因为我目前正在解决同样的问题。执行此操作的正确方法是将修改的文件存储在键/值存储区中(Web存储 - http://www.w3.org/TR/webstorage/)。

如果您需要替换原始文件,您应该通过Web服务器并将修改后的文件放入或张贴到Web服务器上的正确URL。这意味着写一个简单的后端来获取文件并保存它。

下面是简单的存储代码 - 你必须在代码中的适当位置插入一个链接到文件,文件名:

<!DOCTYPE html> 
<html> 
    <head> 
    <title>File editor</title> 
    <script src="http://www.google.com/jsapi"></script> 
    <script> 
     google.load("jquery", "1.4.1"); 
    </script> 
    <script> 
     $(document).ready(function() { 

     // check to see if we have it in storage already 
     if (file = localStorage.getItem('<filename>')) { 
      $("textarea[id='edit_box']").val(file); 
     } else { // get it from the url 
      $.get("<url to file>", null, function(data) 
      { 
      $("textarea[id='edit_box']").val(data); 
      }, "text"); 
     } 

     // save to storage 
     $("textarea[id='edit_box']").bind('keyup', function() { 
      localStorage.setItem('<filename>', this.value); 
     }); 
     }); 
    </script> 
    </head> 
    <body> 
    <form method="get" id="edit_file"> 
     <input type="file"></input> 
     <div id="edit"> 
     <textarea id="edit_box" placeholder="Type here" cols="80" rows="50"></textarea> 
     </div> 
    </body> 
</html>