javascript - 使用ajax时内容被隐藏

标签 javascript jquery ajax

我正在使用 ajax 使用以下代码获取记录。

<html>
<head>
<script>
$(function() {
    $('.go-btn').on('click', function() {
        var selected = $('#my-dropdown option:selected');
            $.ajax({    //create an ajax request to load_page.php
        type: "GET",
        url: "boxplot.html",             
        dataType: "html",   //expect html to be returned                
        success: function(response){                    
            $("#responsecontainer").html(response); 
            //alert(response);
        }

    });
        //alert(selected.val()); 
    });
});
</script>
</head>
<body>

some text
<button class="go-btn" type="submit">Go</button> 
<div id="responsecontainer">
<br><hr><br>
<h2>PCA Plot Distribution:</h2><br>
</body>
</html>

在上面的代码中,内容页面在单击按钮(位于 )时加载,但此后的任何内容都会消失。我该如何解决这个问题?

最佳答案

因为您正在设置对整个 div 的响应。修复你的 html,使得

<div id="responsecontainer"></div> 
<div>
<br><hr><br>
<h2>PCA Plot Distribution:</h2><br>
</div>

因此,您将设置对 responsecontainer 的响应,其余部分保持不变。

关于javascript - 使用ajax时内容被隐藏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42745399/

相关文章:

php - php 和 jquery 哪个更好重定向

javascript - 将字符串从 javascript 发送到 php(在同一文件中)

javascript - 在 iframe 重新加载时隐藏浏览器加载图标

javascript - 如何使用 JQuery 计算 div 内有多少个 id 以特定文本开头的 div?

javascript - 与 jQuery 在同一页面中的图像旋转器

javascript - 对象的 Angular 数组,当按索引拼接时,它总是删除最后一个元素

javascript - 如何取消/中止 jQuery AJAX 文件上传

Javascript使用嵌套函数作为对象来访问

jquery - jquery 的唯一属性值

javascript - 将 jQuery .change() 转换为纯 JavaScript/DOM