Javascript 报告的内容<；部门>；在eventListener函数完成后丢失

这是我的Html。输出将是str

<div id="response_container"> 
     //str 
</div>

//str

下面是javascript

const form = document.getElementById('search_form');
const htmlcontainer = document.getElementById('response_container');
    form.addEventListener('submit', function()
    {
        console.log("Inside sendQuery()");
        var to_search = document.querySelector('#item_to_search').value;
        var xmlObject = createObject();
        console.log(xmlObject);
        xmlObject.open("GET", "getData.php?search="+ to_search +"&srch_submit=search");
        xmlObject.send(null);
        xmlObject.onreadystatechange = function(){
            if(xmlObject.readyState == 4 && xmlObject.status == 200)
            {
                var doc = xmlObject.responseXML;
                var child = doc.documentElement;
                var content = child.firstChild.data;
                console.log(content);
                var arr = JSON.parse(content);

                for(var i = 0; i < arr.length ; i++)
                {
                    str = "<br><span>Name: "+ arr[i][0] +" Roll No: "+ arr[i][1] +"</span>";
                    htmlcontainer.insertAdjacentHTML('afterbegin', str);
                    /*htmlcontainer.innerHTML = str;*/

                }
                /*htmlcontainer.insertAdjacentHTML('afterend', content);*/

            }
            else
            {

            }

        }

const form=document.getElementById（'search_form'）；
const htmlcontainer=document.getElementById（'response_container'）；
form.addEventListener（'submit'，function（）
{
log（“内部sendQuery（）”；
var to_search=document.querySelector（“#item_to_search”）.value；
var xmlObject=createObject（）；
log（xmlObject）；
open（“GET”、“getData.php？search=“+to_search+”&srch_submit=search”）；
send（null）；
xmlObject.onreadystatechange=函数（）{
if（xmlObject.readyState==4&&xmlObject.status==200）
{
var doc=xmlObject.responseXML；
var child=doc.documentElement；
var content=child.firstChild.data；
控制台日志（内容）；
var arr=JSON.parse（内容）；
对于（变量i=0；i名称：“+arr[i][0]+”卷号：“+arr[i][1]+”；
htmlcontainer.insertAdjacentHTML（'afterbegin'，str）；
/*htmlcontainer.innerHTML=str*/
}
/*htmlcontainer.insertAdjacentHTML（'afterend'，content）*/
}
其他的
{
}
}

---

此ajax代码与另一个php文件一起工作，并返回数据库中与输入的字符串匹配的所有名称。但名称不会显示在具有

id=“response\u container”的这个div中

。我尝试在调试器中停止程序，发现循环进行时，所有名称都会显示在中，但在eventListener完成其工作后消失。请提供帮助。是否有任何方法可以解决此问题？我希望输入名称。谢谢你阻止浏览器默认表单提交过程

改变

form.addEventListener('submit', function() {

到

---

阻止浏览器默认表单提交过程

改变

form.addEventListener('submit', function() {

到

---

您需要防止表单“提交”，因为页面重新加载，表单基本上会删除您的div

form.addEventListener('submit', function(e) {
    e.preventDefault();
    //....
}

---

您需要防止表单“提交”，因为页面重新加载，表单基本上会删除您的div

form.addEventListener('submit', function(e) {
    e.preventDefault();
    //....
}

---

页面正在重新加载吗？您似乎没有阻止默认提交process@charlietfl我应该在哪里添加事件。preventdefault？？页面是否正在重新加载？您似乎没有阻止默认提交process@charlietfl我应该在哪里添加event.preventdefault？？？@D…-将表单内容发送到forms action属性，并在主窗口中显示服务器返回的页面。form将使用form的

方法将输入的数据发送到
action
中的url。如果两者都不存在，它将作为GET发送到当前页面url，导致页面重新加载。明白了，感谢u.@D.-发送内容将表单的nts发送到表单操作属性指定的URL，并在主窗口中显示服务器返回的页面。表单将使用表单的
方法
将输入数据发送到
操作中的URL。如果两者都不存在，它将作为GET发送到当前页面URL，从而导致页面重新加载。明白了吗你们两个。