javascript textarea 的 innertext 不会重置重新加载页面
javascript innertext of textarea doesn't reset realoading page
当我加载页面时,我有以下代码可以完美运行
它允许双击 P 并使其可以使用文本区域编辑,并在单击“保存”按钮时将其恢复为 P
双击“some lorem ipsum”字符串会将 P 切换到内容取自 P 内容的 texarea,因此它将显示“一些 lorem ipsum"
你做了一些编辑,假设你删除了“some lorem ipsum”,现在你写了“编辑了新内容”,
当您点击“保存”时,它会转回显示 P,现在新内容是“已编辑新内容”
我遇到的问题是,如果我在 Firefox、
中单击重新加载按钮
P 回到原始内容“some lorem ipsum”
但是如果我双击“some lorem ipsum”字符串,textarea 文本不会从 P
而是显示之前的“已编辑新内容”
我是不是忘记了什么?谢谢指点
var noteP = document.getElementById("noteP");
var noteTA = document.getElementById("noteTA");
var noteDD = document.getElementById("noteDD");
var noteED = document.getElementById("noteED");
var TestoOriginale = "";
var TestoAttuale = "";
noteED.style.display = "none";
noteP.ondblclick = function LoadText() {
TestoOriginale = noteP.innerText; // load the P text
noteTA.innerText = TestoOriginale; // -THE ERROR IS HERE- write the P text into the textarea
noteDD.style.display = "none"; // hide P DIV
noteED.style.display = "block"; // show text area DIV
}
function UpdateText() {
TestoAttuale = noteTA.value; // get current textarea text
noteP.innerText = TestoAttuale; // write it into P
noteDD.style.display = "block";
noteED.style.display = "none";
}
document.getElementById("salvaBT").onclick = function AJAXPost(NoteUpdateForm) {
UpdateText();
/**
more code later
**/
}
<div id="noteDD">
<p id="noteP">some lorem ipsum</span>.</p>
</div>
<div id="noteED">
<form action="./note-update.php" method="post" id="NoteUpdateForm">
<textarea id="noteTA" name="NoteUpdateText" form="NoteUpdateForm" rows="5" cols="40"></textarea><br>
</form>
<input type="button" value="Cancel"><input type="button" id="salvaBT" value="Save" onclick="javascript:AJAXPost(this);">
</div>
据我了解,事件发生后您想在保存更改后更新 textarea 值。
您需要将value
传递给textarea
以保存修改。
而不是做
noteTA.innerText = TestoOriginale;
做:
noteTA.value = TestoOriginale;
当您使用 innerText
时,您将文本放入 <textarea>
HTML 选择器中,而不是将其放入文本区域 value
属性中。
当我加载页面时,我有以下代码可以完美运行
它允许双击 P 并使其可以使用文本区域编辑,并在单击“保存”按钮时将其恢复为 P
双击“some lorem ipsum”字符串会将 P 切换到内容取自 P 内容的 texarea,因此它将显示“一些 lorem ipsum"
你做了一些编辑,假设你删除了“some lorem ipsum”,现在你写了“编辑了新内容”,
当您点击“保存”时,它会转回显示 P,现在新内容是“已编辑新内容”
我遇到的问题是,如果我在 Firefox、
中单击重新加载按钮P 回到原始内容“some lorem ipsum”
但是如果我双击“some lorem ipsum”字符串,textarea 文本不会从 P
而是显示之前的“已编辑新内容”
我是不是忘记了什么?谢谢指点
var noteP = document.getElementById("noteP");
var noteTA = document.getElementById("noteTA");
var noteDD = document.getElementById("noteDD");
var noteED = document.getElementById("noteED");
var TestoOriginale = "";
var TestoAttuale = "";
noteED.style.display = "none";
noteP.ondblclick = function LoadText() {
TestoOriginale = noteP.innerText; // load the P text
noteTA.innerText = TestoOriginale; // -THE ERROR IS HERE- write the P text into the textarea
noteDD.style.display = "none"; // hide P DIV
noteED.style.display = "block"; // show text area DIV
}
function UpdateText() {
TestoAttuale = noteTA.value; // get current textarea text
noteP.innerText = TestoAttuale; // write it into P
noteDD.style.display = "block";
noteED.style.display = "none";
}
document.getElementById("salvaBT").onclick = function AJAXPost(NoteUpdateForm) {
UpdateText();
/**
more code later
**/
}
<div id="noteDD">
<p id="noteP">some lorem ipsum</span>.</p>
</div>
<div id="noteED">
<form action="./note-update.php" method="post" id="NoteUpdateForm">
<textarea id="noteTA" name="NoteUpdateText" form="NoteUpdateForm" rows="5" cols="40"></textarea><br>
</form>
<input type="button" value="Cancel"><input type="button" id="salvaBT" value="Save" onclick="javascript:AJAXPost(this);">
</div>
据我了解,事件发生后您想在保存更改后更新 textarea 值。
您需要将value
传递给textarea
以保存修改。
而不是做
noteTA.innerText = TestoOriginale;
做:
noteTA.value = TestoOriginale;
当您使用 innerText
时,您将文本放入 <textarea>
HTML 选择器中,而不是将其放入文本区域 value
属性中。