如何使用 jquery 从 url 获取 div？

Question

我有一个 web 应用程序在本地运行，我想在不加载完整页面的情况下使用 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>

我试过这个例子但不起作用

Answer 1

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

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

Answer 2

在通过文档稍作调整后，我能够做到这一点。

<script>
    function ready() {
        $("#main").load("https://localhost:44330/ #testblock",
            function (response)
            {
                });
            }
        $(document).ready(ready);
</script>

如何使用 jquery 从 url 获取 div？

问题描述

2 个解决方案

解决方案1
0 2019-11-19 12:26:02

解决方案2
0 2019-11-19 15:28:26

如何使用 jquery 从 url 获取 div？

问题描述

2 个解决方案

解决方案1 0 2019-11-19 12:26:02

解决方案2 0 2019-11-19 15:28:26

解决方案1
0 2019-11-19 12:26:02

解决方案2
0 2019-11-19 15:28:26