javascript - 如何使用 jquery 从 url 获取 div?

标签 javascript jquery

我有一个本地运行的网络应用程序,我想使用 jquery 从此 url 获取特定的 div,而不加载完整的页面。有一个部分包含用于打开模式对话框的按钮。我浏览了一些在这里找到的例子,但无法解决我的问题。下面是页面

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/modal.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>

<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>

<script>
    $(document).ready(function(){
        $.post("https://localhost:44330/",{},function(response){
            $(response).find('testblock').each(function(){
                $('#main').append($(this).html());
            });
        });
    });
</script>
</head>
<body>
<div class="text-center">
    <h1 class="display-4">Hello from sub application 2</h1>

    <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal1">Open</button>

    <!-- Modal -->
    <div class="modal fade" id="myModal1" role="dialog">
        <div class="modal-dialog modal-lg" style="height: 100%; width: 100%">

            <!-- Modal content-->
            <div class="modal-content" style="height: 90%; width: 100%">
                <div class="modal-body" id="main">
                    @*<iframe src="https://localhost:44330/" width="1200" height="700" style="overflow: hidden; height: 90%; width: 100%; border: 1px solid red;" scrolling="yes"></iframe>*@

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>

        </div>
    </div>
</div>
<script src="js/modalClick.js"></script>

</body>
</html>

URL 具有以下结构

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<div id ="testblock">
    <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal5">Open modal</button>

    <!-- Modal -->
    <div class="modal fade" id="myModal5" role="dialog">
        <div class="modal-dialog modal-lg" style="height: 100%">

            <!-- Modal content-->
            <div class="modal-content" style="height: 90%">
                <div class="modal-body" style="height: 90%">

            </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal" id="myBtn5">Close</button>
                </div>
            </div>
        </div>
     </div>
</div>
</body>
</html>

我试过this示例但不起作用

最佳答案

您忘记添加# 。您将 testblock 定义为 ID。 <div id="testblock"> ...

$(response).find('#testblock') ...

关于javascript - 如何使用 jquery 从 url 获取 div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58933817/

相关文章:

javascript - Ember.js 2 当您点击它的路线时触发 Controller 操作

javascript - 如何在 HTML 表中获取自动序列号列

javascript - 基于浏览器插件的 RIA 与基于 Java Script 的 RIA 的性能

javascript - JavaScript 有类似 simple_html_dom.php 的东西吗?

javascript - {尚无答案}从YouTube JSON Api获取评论分数

javascript - 无法使用jquery获取悬停的svg元素的id

javascript - 动态设置超时

javascript - d3.js 中的标签问题

javascript - 如何在javascript中获取焦点元素的Id

javascript - 如何将常量从一个文件传递到另一个文件