显示加载页面无法正常工作 [英] Show loading page not working properly

问题描述

我有这个标记：

<div class="container" id="logo" style="text-align:center;">
  //other loading stuff
  <a href="" id="enter" onclick="EnterSite()">Enter Website</a>
</div>  

<div id="content">
 //main content
</div>    

在结束之前的顶部 标签我有：

At the top before the closing head tag I have:

<script>
    $(function() {
        $('#enter').hide();
    });
    $(window).load(function() {
        $('#enter').show();
    });
</script>  

我在底部（收盘前正文标签）：

And at the bottom I have (before the closing body tag):

function EnterSite() {
        $("#enter").click(function(){
            $("#content").show(2000);
        });
    }  

和CSS：

#logo {
  z-index: 99;
}
#content {
   display: none;
} 

但它只显示 徽标 div并点击 输入网站 链接不执行任何操作。

But it just shows the logo div and clicking on the Enter Website link does nothing.

我想要做的是显示 logo div，直到页面加载（window.load）与输入网站链接隐藏。加载页面后，显示点击后的链接将显示 内容 div

what I want to do is show the logo div till the page is loaded (window.load) with the Enter Website link hidden. Once the page is loaded then show the link which on click will show the content div

推荐答案

问题是您使用的是 onclick 处理程序，以使用jQuery绑定新的单击处理程序。单击< a> 标记时，新的点击处理程序不会触发，因为事件已经发生。

The problem is you are using an onclick handler, to bind a new click handler using jQuery. The new click handler won't fire first time you click on the <a> tag, because the event has already happened.

从标记中删除 onclick 并使用

$(function(){
  $("#enter").hide().click(function(){
        $("#content").show(2000);
   });
}) 

或更改为：

function EnterSite() {       
       $("#content").show(2000);

}

我建议使用第一个解决方案并避免混合使用内联脚本和jQuery保持所有脚本不引人注目且易于维护

I suggest using first solution and avoid mixing inline script and jQuery to keep all your script unobtrusive and easier to maintain

这篇关于显示加载页面无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！