Javascript 如何在DIV内显示echo内容

Javascript 如何在DIV内显示echo内容,javascript,php,html,tinymce,echo,Javascript,Php,Html,Tinymce,Echo,我试图加载一个html文件,以便使用tinymce进行内联编辑,基本上是将输出回显到一个div区域,以便由编辑器接管。页面加载很好,但是编辑器显示在html页面的“上方”,看起来像一个小div框,跨越页面而不是内容。我需要的是echo的$contents出现在div区域内,而不是它似乎出现在它下面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/x

我试图加载一个html文件,以便使用tinymce进行内联编辑,基本上是将输出回显到一个div区域,以便由编辑器接管。页面加载很好,但是编辑器显示在html页面的“上方”,看起来像一个小div框,跨越页面而不是内容。我需要的是echo的$contents出现在div区域内,而不是它似乎出现在它下面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="../tinymce/js/tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: "div.edit",
theme: "modern",
plugins: [
    ["advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker"],
    ["searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking"],
    ["save table contextmenu directionality emoticons template paste"]
    ["fullpage"]
],
add_unload_trigger: false,
schema: "html5",
inline: true,
toolbar: "undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image     | print preview media",
statusbar: false
});

tinymce.init({
selector: "h1.edit",
theme: "modern",
add_unload_trigger: false,
schema: "html5",
inline: true,
toolbar: "undo redo",
statusbar: false
});
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>

<body>

<div class="edit"><?php 
$filename = "../projectevo/emeraldcity.html";
$handle = fopen($filename, "r");
$contents = fread($handle, filesize($filename));
fclose($handle);

echo $contents;

?></div>
</body>
</html>


tinymce.init({
选择器:“div.edit”,
主题:“现代”,
插件:[
[“advlist autolink图像列表charmap打印预览hr锚定页面中断拼写检查器”],
[“searchreplace wordcount visualblocks visualchars代码全屏插入日期时间媒体非中断”],
[“保存表格上下文菜单方向性表情模板粘贴”]
[“整页”]
],
添加卸载触发器:false,
模式:“html5”,
是的,
工具栏:“撤消重做|样式选择|粗体斜体|对齐左对齐中心对齐右对齐对齐对齐对齐|粗体numlist outdent缩进|链接图像|打印预览介质”,
状态栏:false
});
tinymce.init({
选择器:“h1.编辑”,
主题:“现代”,
添加卸载触发器:false,
模式:“html5”,
是的,
工具栏:“撤消重做”,
状态栏:false
});

您最好使用文本区域模式,它会很好地工作

<textarea name="" cols="" rows="100">
<?php 
$filename = "../projectevo/emeraldcity.html";
$handle = fopen($filename, "r");
$contents = fread($handle, filesize($filename));
fclose($handle);
echo $contents;
?>
</textarea>
而不是你的

selector: "div.edit",

你能附上屏幕截图吗?你能在
tinymce
中编辑html吗?不,编辑器只出现在所有html上方的小div样式框中。我可以单击并突出显示html的所有其余部分,但它是不可编辑的。当我使用textarea和tinymce的内联编辑时,它会将其与html完美地放在文本区域中,但是tinymce不会加载,它只是将html放在textarea框中。您必须将tinymce初始化代码替换为模式:“textareas”。我在回答中添加了解释。我忘了将选择器更改为textarea以将其置于该模式,但这只提供了编辑html的选项,而不是内联。在看到允许编辑html的编辑后,这非常有效。然而,我想要的是它显示实际的页面,而不是源html代码,并编辑它所见即所得风格(内联)我现在不清楚,你需要渲染的html所见即所得编辑或查看源代码。
selector: "div.edit",