要保存和显示的HTML div文本 [英] HTML div text to save and display
问题描述
以下是我的编辑器代码，当用户按下显示编辑器文本按钮时，div标签中的文本必须保存并且必须显示在同一页面上。如何在HTML中实现此功能？
The following is my editor code, when the user presses 'show editor text' button, the text in the div tag has to be saved and the same has to be displayed on the same page. How can I achieve this in HTML?
<!DOCTYPE html>
<html>
<head>
<title>ACE in Action</title>
<style type="text/css" media="screen">
#editor {
position: absolute;
top: 0;
right: 0;
bottom: 7%;
left: 0;
}
</style>
</head>
<body>
<div id="editor">
blah blah blah!
</div>
<script src="U:\hyd\code\JS\ace-builds-master\ace-builds-master\src-noconflict\ace.js" type="text/javascript" charset="utf-8"></script>
<script>
var editor = ace.edit("editor");
editor.setTheme("ace/theme/cobalt");
editor.getSession().setMode("ace/mode/gc");
</script>
<button type= "button" style="position: absolute; left: 10%; bottom: 2%;" id="execute" onclick="window.open('http://149.77.164.100:8180/FirstServlet/mygeco','_top','resizable=yes')">Click to execute</button>
<button type= "button" style="position: absolute; left: 25%; bottom: 2%;" id="editortxt" onclick="showstuff('editor');">Show editor text
</button>
</body>
</html>
--------------------- ------------- EDIT ---------------------------------
----------------------------------EDIT---------------------------------
var edit = ace.edit("editor");
var code = edit.getSession().getValue();
window.open(code, _top);
添加了上述代码，但没有输出。我想在新窗口中显示代码，然后保存。
added the above code, yet no output. I want to display the code on a new window, and then save it.
推荐答案
无法理解编辑器的行为方式
Couldn't Understand the way your editor behave
考虑到您想要将文字保存在一个按钮上，请点击&显示测试版本
Considering that you want to save the text on one button click & display the test latter on
在您点击此按钮时添加以下按钮您的编辑器内容将保存在变量中，编辑器将为空白
add the below button to you html on click of this button your editor content would be saved in a variable and editor will be blank
<input type='button' style="position: absolute; left: 20%; bottom: 2%;" id='save' value="Save"/>
点击下面的按钮，保存的内容将显示回来
Onclick of the below button the saved content would be displayed back
<button type= "button" style="position: absolute; left: 25%; bottom: 2%;" id="editortxt" >Show editor text
</button>
<script type='text/javascript'>
var StoreEditorContent; //declare a variable to save Content
document.getElementById('save').addEventListener("click", SaveText); // adding event listner for onclick for Saving text
function SaveText(){
StoreEditorContent = document.getElementById('editor').innerHTML; // Save the Content into
document.getElementById('editor').innerHTML = ""; // to blank the editor Content
}
document.getElementById('editortxt').addEventListener("click", ShowText); // adding event listner for onclick for Saving text
function ShowText(){
document.getElementById('editor').innerHTML = StoreEditorContent ; // Display the Content into editor
}
</script>
这篇关于要保存和显示的HTML div文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
