javascript - 单击元素时更改 URL 和 CSS

Question

基本上，我的网站上有几个页面，我使用 PHP 将内容包含在页面中，并使用 jQuery 通过将 CSS 中的显示设置为“无”或“阻止”来在内容之间“切换”。但是，我正在努力让它在带有菜单的主页中工作。所以我需要当用户点击相应的链接时，页面会切换到包含该内容的页面，还要应用相应的CSS来显示相应的内容。到目前为止，我有(URL 被屏蔽):

<script type="text/javascript">
    $(document).ready(function(){
        $('#ourMissionMenu').click(function() {
                window.location = 'http://beta.***.com/aboutUs.php';
                $('#rightReplace').css({
                  "display":"none"
                  });
                  $('#ourHistory').css({
                  "display":"none"
                  });
                  $('#meetTeam').css({
                  "display":"none"
                  });
                  $('#communityOutreach').css({
                  "display":"none"
                  });
                  $('#connectUs').css({
                  "display":"none"
                  });
                  $('#blog').css({
                  "display":"none"
                  });
                   $('#ourMission').css({
                  "display":"block"
                  }); 
        });
});


</script>

Answer 1

如果您更改窗口的位置，则当前页面中的所有 javascript 都将停止。您不能指望一个页面中的 javascript 来控制另一页上的内容。这将严重违反安全规定。

您需要在“aboutUs.php”上运行 javascript，或者将 aboutUs 内容动态加载到当前页面。或者，更好的是，首先让 aboutUs.php 具有正确的 css。