Question

我有这个标记：

<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>

在结束head代码之前的顶部我有：

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

在底部我（在结束body标签之前）：

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

和CSS：

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

但它只是显示 logo div并点击 Enter Website 链接不执行任何操作。

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

的链接

Answer 1

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

从标记中删除onclick，然后使用

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

或改为：

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

}

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

Answer 2

试试这个：

$(window).load(function () {
    $('#enter').show();
});
$(document).ready(function () {
    $("#enter").click(function () {
        $("#content").show(2000);
    });
});

Fiddle here.

显示加载页面无法正常工作

2 个答案: