Javascript jQuery'；s.prepend正在替换我的内容，而不是将其添加到开头

我试图将输入的文本放在一个列表中，并允许用户添加多个项目，同时将新项目添加到顶部。我正在使用.prepend，它应该将新项添加到顶部，但它正在替换现有元素。有什么想法吗

函数getParameter（名称）{ name=name.replace（/[\[]/，“\\[”）。replace（/[\]]/，“\\]”）； var regex=new RegExp（“[\\？&]”+name+“=（[^&\]*）”， results=regex.exec（location.search）； 返回结果===null？”：decodeURIComponent（结果[1]。替换（/\+/g，”）； } 函数postMessage（）{ var currentTime=新日期（）.getSeconds（）， 想法=获取参数（“post”）， message=“

”+思想+”-“+currentTime+”

”； $（“#列表”）.prepend（消息）； } $（“表格”）。在（“提交”，postMessage（））上；

---

这是因为提交表单时，页面会重新加载。因此，您的内容并没有真正被替换，实际上发生的是（1）页面重新加载并清除所有内容，（2）作为参数添加到URL的输入现在作为第一个也是唯一的内容添加到列表中

要防止出现这种情况，您可以：

通过更改

$（“表单”）。在（“提交”，postMessage（））上至

$（“表单”）。在（“提交”上，函数（e）{e.preventDefault（）；postMessage（）；}）

将

更改为

（常规按钮），完全绕过整个提交问题。因为表单不需要提交，所以提交按钮实际上是不必要的，甚至有点放错了位置。您也不需要阻止任何默认行为，在我看来，这要干净得多。
此选项符合我的偏好，因此我将在下面更详细地解释此选项：

---

$（窗口）.on（“加载”，函数（）{
$（“.input”）。单击（函数（）{
$（this.select（）；
});
$（“#search.submit”）。单击（函数（）{
var currentTime=新日期（）.getSeconds（），
想法=$（“#search.input”）.val（），
message=“
”+思想+”-“+currentTime+”秒；
$（“#列表”）.prepend（消息）；
});
});
html{
身高：100%；
}
身体{
背景：#fff；
字体大小：13px；
最小宽度：800px；
}
溴{
清除：左；
}
#标题{
背景：矢车菊蓝；
填充：10px 5px；
盒影：0px 1px 5px#fff；
文本对齐：居中；
}
#搜寻{
显示：内联块；
}
.输入{
宽度：300px；
填充物：2个3个；
边框：2px实心#A2C4DA；
字体大小：1.2米；
线高：2；
}
.提交{
填充：6px 12px；
垂直对齐：顶部；
字体大小：粗体；
文本阴影：1px 1px 1px#fff；
背景：#fff；
边框：1px实心#6FD6F7；
线高：2；
}
.submit:hover{cursor:pointer；}
#页面{
宽度：800px；
背景：道奇蓝；
边框：1px实心#ffffff；
利润率：10px自动0px；
填料：1米2米；
字号：2em；
}
#李佩奇{
列表样式：无；
文本对齐：居中；
颜色：#fff；
边框顶部：1px实心#fff；
}
#第li页：第n个子项（n+1）{
边界：无；
}




这是因为提交表单时，页面会重新加载。因此，您的内容并没有真正被替换，实际上发生的是（1）页面重新加载并清除所有内容，（2）作为参数添加到URL的输入现在作为第一个也是唯一的内容添加到列表中

要防止出现这种情况，您可以：

通过更改

$（“表单”）。在（“提交”，postMessage（））上至

$（“表单”）。在（“提交”上，函数（e）{e.preventDefault（）；postMessage（）；}）

将
更改为
（常规按钮），完全绕过整个提交问题。因为表单不需要提交，所以提交按钮实际上是不必要的，甚至有点放错了位置。您也不需要阻止任何默认行为，在我看来，这要干净得多。

此选项符合我的偏好，因此我将在下面更详细地解释此选项：



$（窗口）.on（“加载”，函数（）{
$（“.input”）。单击（函数（）{
$（this.select（）；
});
$（“#search.submit”）。单击（函数（）{
var currentTime=新日期（）.getSeconds（），
想法=$（“#search.input”）.val（），
message=“
”+思想+”-“+currentTime+”秒；
$（“#列表”）.prepend（消息）；
});
});
html{
身高：100%；
}
身体{
背景：#fff；
字体大小：13px；
最小宽度：800px；
}
溴{
清除：左；
}
#标题{
背景：矢车菊蓝；
填充：10px 5px；
盒影：0px 1px 5px#fff；
文本对齐：居中；
}
#搜寻{
显示：内联块；
}
.输入{
宽度：300px；
填充物：2个3个；
边框：2px实心#A2C4DA；
字体大小：1.2米；
线高：2；
}
.提交{
填充：6px 12px；
垂直对齐：顶部；
字体大小：粗体；
文本阴影：1px 1px 1px#fff；
背景：#fff；
边框：1px实心#6FD6F7；
线高：2；
}
.submit:hover{cursor:pointer；}
#页面{
宽度：800px；
背景：道奇蓝；
边框：1px实心#ffffff；
利润率：10px自动0px；
填料：1米2米；
字号：2em；
}
#李佩奇{
列表样式：无；
文本对齐：居中；
颜色：#fff；
边框顶部：1px实心#fff；
}
#第li页：第n个子项（n+1）{
边界：无；
}




这是因为提交表单时，页面会重新加载。因此，您的内容并没有真正被替换，实际上发生的是（1）页面重新加载并清除所有内容，（2）作为参数添加到URL的输入现在作为第一个也是唯一的内容添加到列表中

要防止出现这种情况，您可以：

通过更改

$（“表单”）。在（“提交”，PostMessage
function getParameter(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
function postMessage(){
    var currentTime = new Date().getSeconds(),
        thoughts = getParameter("post"),
        message = "<li>" + thoughts + " - " + currentTime + "</li>";
    $("#list").prepend(message);
}
$("form").on( "submit", postMessage());

function getParameter(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
function postMessage(){
 var currentTime = new Date().getSeconds(),
  thoughts = $("#post").val(),
  message = "<li>" + thoughts + " - " + currentTime + " seconds </li>";
 $("#page").prepend(message);
  $("#post").val("");
}
$("form").on( "submit", function(e){
  e.preventDefault();
  postMessage();
});

<input type="text" name="post" id="post" placeholder="thoughts?"/>