5

我一直在尝试将 tinymce 编辑器 textarea 内容保存到 .txt 文件中，但尚未成功。这是我的 html 文件代码：

<!Doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>TinyMCE example</title>
  <meta name="description" content="HTML5 Basic template">
  <meta name="author" content="R Dickinson">
  <link rel="stylesheet" href="css/styles.css?v=1.0">
  <script src="js/scripts.js"></script>
  <script type="text/javascript" src="jscripts/tiny_mce/tiny_mce.js"></script>
  <script type="text/javascript">
tinyMCE.init({
// General options
mode : "textareas",

});
</script>
  <!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
</head>
<body>
    <header>
<h1>test tinymce save</h1>
    </header>
    <nav>
    </nav>
    <section>

<form method="post" action="test.php">
    <p> 
        <textarea name="content" style="width:50%"></textarea>
        <input type="submit" value="Save" />
    </p>     
</form>
    </section>
    <aside>
    </aside>
    <footer>
        </footer>
</body>
</html>

现在 test.php

<?php
/*
 * test.php
  */
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <title>test tiny mce</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta name="generator" content="Geany 0.21" />
</head>

<body>
<?php

echo(stripslashes($_POST['content']));
?>
<?php
$file = "data.txt";
$fp = fopen($file, 'w');
$data =(stripslashes($_POST['content']));
fwrite($fp, $data);
fclose($fp);
?>

</body>

</html>

我很感谢有用的回复来解决这个问题 - 非常感谢:-)

更新 在下面的第一个答案之后，我添加了 triggerSave as：

 <script language="Javascript">
function submitForm() {
tinyMCE.triggerSave();
document.forms[0].submit();
}
</script>

和

<form method="post" action="test.php">
<p> 
    <textarea name="content" style="width:50%"></textarea>
    <!--<input type="submit" value="Save" />-->
    <a href="javascript:submitForm();">Submit Form</a>
</p>

但仍然没有成功...感激地收到更多帮助

更新 2 这是我的 jQuery TinyMCE 版本：

 <!Doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Sample WebPage</title>
  <meta name="description" content="HTML5 Basic template">
  <meta name="author" content="R Dickinson-see sitepoint etc">
  <link rel="stylesheet" href="css/styles.css?v=1.0">
  <script src="js/scripts.js"></script>
  <script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
        google.load("jquery", "1.3");
</script>
<!-- Load jQuery build -->
<script type="text/javascript" src="jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
        mode : "textareas"
});
</script>
  <!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
</head>
<body>
    <header>
        <h1>Enter the main heading, usually the same as the title.</h1>
    </header>
    <nav>
    </nav>
    <section>


<!-- OF COURSE YOU NEED TO ADAPT ACTION TO WHAT PAGE YOU WANT TO LOAD WHEN HITTING "SAVE" -->
<form method="post" action="show.php">
        <p>     
                <textarea name="content" cols="50" rows="15">This is some content that will be editable with TinyMCE.</textarea>
                <input type="submit" value="Save" />
        </p>
</form>

    </section>
    <aside>
    </aside>
    <footer>

  </footer>
</body>
</html>
4

2 回答 2

8

问题本身归结为：

如何将 TinyMCE 的 HTML 内容保存到文件中。

嗯，首先，你需要：

1) 获取编辑器的内容
2) 将此内容发送到 PHP 脚本
3) 实现一些将内容保存到文件中的功能

获取内容
确保以应有的方式获取内容。

例如，

<script type="text/javascript">

window.onload = function(){

  var btn = document.getElementById('SubmitBtn');

  btn.onclick = function(){

     //This MUST alert HTML content of editor.
     alert( tinyMCE.activeEditor.getContent() );
  }
}

</script>

<input type="button" id="SubmitBtn" value="Get HTML content"/>

将内容发送到 PHP 脚本

您需要做的就是将方法的值发送tinyMCE.activeEditor.getContent()到 PHP 脚本。

好吧，你应该使用Jquery-AJAX它。

假设您包含jquery.js在 head 部分的脚本标记中，下一步是将 JavaScript 变量发送到 PHP 脚本

这将类似于这个：

<script type="text/javascript">
$(function(){

  var url = "path_to_your_php_script.php";

  $("#SomeSubmitButton").click(function(){
    //"content" will PHP variable 
    $.post(url, { "content" : tinyMCE.activeEditor.getContent() }, function(respond){

       if ( respond == ){
          alert('Content saved to file');
          return;
       } else {
          //Error message assumed
          alert(respond);
        }
    });
  });

});

</script>

PHP 脚本

由于我们发送"content"这个将被填充在$_POSTsuperglobal

<?php

if ( isset($_POST['content']) ){

   //This is what you want - HTML content from tinyMCE
   //just treat this a string

   if ( save_html_to_file($_POST['content'], '/some_file.html') ){
     //Print 1 and exit script
     die(1);
   } else {
      die('Couldnt write to stream');
   }
}

/**
 * 
 * @param string $content HTML content from TinyMCE editor
 * @param string $path File you want to write into
 * @return boolean TRUE on success
 */
function save_html_to_file($content, $path){
   return (bool) file_put_contents($path, $content);
}

因此，执行此操作后，您应该返回alert成功消息。

于 2012-12-01T17:56:59.310 回答
0

您应该在提交表单之前更新您的 TinyMCE 实例。使用这个 javascript：

tinyMCE.triggerSave();

我通常把它放在一个函数中并在onsubmit表单事件中调用它。

Stackoverflow 中已经有围绕这个主题的不同问题。

于 2012-12-01T16:57:14.827 回答