jQuery load()函数-无法从动态加载的标头内容中获取高度

时间:2019-02-08 19:02:38

标签: javascript jquery html5 css3

实际上,我已经设计了一个标头,并使用load()函数动态显示它。加载标题后,我尝试获取标题的高度。

为此,我编写了代码。但是该代码无法正常工作。我无法获得动态加载的元素的高度。

这是我用来动态显示的内容:

<header class="header">
    <nav class="navbar navbar-expand-lg fixed-top navbar-dark">
        <div class="container-fluid">
            <ul class="navbar-nav nav mr-auto mt-2 mt-lg-0 header-lft-menu">
                <li class="nav-item">
                    <a class="nav-link active" data-toggle="tab" href="#home">DASHBOARD</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#profile">PROJECTS</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#contact">PEOPLE</a>
                </li>
            </ul>
        </div>
    </nav>
</header>

这是我用于使用load()方法显示标题内容的标签:

<div class="header-control"></div>

这是我用来获取标头高度的jQuery代码。

$(function() {
    $(document).on("scroll", function() {
        alert($(".header").outerHeight(true));
    });
});

1 个答案:

答案 0 :(得分:0)

您可以遵循以下代码,可能会对您有所帮助。

 $("button").click(function(){   $("#div1").load("demo_test.txt",
 function(responseTxt, statusTxt, xhr){
 if(statusTxt == "success")
  alert("External content loaded successfully!");
 if(statusTxt == "error")
  alert("Error: " + xhr.status + ": " + xhr.statusText);   }); });