Question

我是HTML中的虚拟人物。在我的项目中，我想使用ACE编辑器来允许用户编辑和保存文件。我成功加载文件，并使用ACE编辑器打开它。问题是如何保存它。对于这部分，我需要你的帮助。

以下是我编写的使用ACE的代码。

<?php
if(isset($_POST["save_modification"])){
$file = "./".$_POST["file_name"];
$file_ptr=fopen($file,"w");
fwrite($file_ptr,$_POST["content"]);
fclose($file_ptr);
}?>

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" media="all" type="text/css" href="./css/style.css" />
<title>Test</title>
</head>

<body>
<div class="site">
    <div class="header">
        <span>Test</span>
    </div>
</div>

<div class="clean"></div>

<div class="corp">
    <div class="corp_ctn">
        <h1>Edit a file</h1>

        <div id="content" class="paragraphe">

            <?php
                $dir=opendir("./");
                while($file=readdir($dir)){
                    if(!in_array($file, array(".",".."))) {
                        echo '<div style="float:left; margin:0 10px; text-align:center;"><a href="?f='.$file.'">';
                        echo $file;
                        echo '</a></div>';
                        echo '<br/>';
                    }
                }
            ?>

            <br clear="all"/>

            <?php
                if(isset($_GET["f"])) {
                    echo "<h1>{$_GET["f"]}</h1>";
                    $file = "./".$_GET["f"];
                    $content = file_get_contents($file);
            ?>


                    <form method="POST" action="index_select_lua_script.php">
                        <div id="editor" name="content" style="width:100%;height:200px;">
                            <?php echo $content ?> 
                        </div>

                        <script src="js/ace/ace.js" type="text/javascript" charset="utf-8"></script>
                        <script>
                            var editor = ace.edit("editor");
                            editor.setTheme("ace/theme/monokai");
                            editor.getSession().setMode("ace/mode/lua");
                            editor.getSession().setTabSize(4);
                            editor.setHighlightActiveLine(true);
                            editor.resize();
                        </script>
                        <input type="hidden" name="file_name" value="<?php echo $_GET["f"] ?>" />
                        <input type="submit" name="save_modification" value="Save modification" />
                    </form>
                    <br/><br/>
            <?php
                }
            ?>
            </div>
        </div>
    </div>
</div>

当我保存修改时，使用保存按钮，内容为空。拜托，你知道我该怎么办吗？

谢谢

Answer 1

HTML5 Filesystem API现在可以很好地处理这样的任务。有几种方法可以捕获编辑区域的内容，一旦完成，就可以保存它。

看看像：

http://www.codeproject.com/Articles/668351/HTML-File-API-Capability-and-Compatibility

http://blog.teamtreehouse.com/building-an-html5-text-editor-with-the-filesystem-apis

http://www.html5rocks.com/en/tutorials/file/filesystem/

不记得在哪里，但如果您愿意的话，现在也可以使用JS将ZIP文件放在一起。

如何使用ACE编辑器编辑和保存文件

1 个答案: