Question

实现以下目标的可行方法是什么：

一个网站有两页;父页面和内页面。如果用户通过键入地址或通过父页面以外的页面中的链接直接进入Inside页面，则显示“foo”。如果用户从父页面进入Inside页面，则显示“bar”。

如果可能的话，我需要在JS中完成这项工作。如果没有，PHP是次要的选择。

Answer 1

您可以使用document.referrer获取用户来自的页面。

所以你可以像这样实现你的解决方案：

if (document.referrer === 'yoursite.com/parentpage') {
  // do bar
} else {
  // do foo
}

Answer 2

请尝试此

此代码在第二页

jQuery(window).load(function() {
  if (sessionStorage.getItem('dontLoad') == null) {
    //show bar
  }
  else{
    //show foo
  }
});

父页面中的此代码

jQuery(window).load(function() {
  sessionStorage.setItem('dontLoad','true') 
});

Answer 3

with php：

有一种简单的方法是创建一个中介页面，该页面在创建会话/ cookie后重定向到内页..然后，如果你将获得session / cookie，你会显示foo＆amp;未设置会议。

如果有人直接来自网址，则找不到会话/ cookie。它显示吧..

Answer 4

您可以使用document.referrer，但并不总是这样设置。您可以在父页面上的URL中添加一个参数，然后在子页面中检查它是否存在

父页面上的链接：

<a href='myChildPage.html?fromParent=1'>My Child Page</a>

您孩子页面上的JS代码：

var fromParent=false;
var Qs = location.search.substring(1);
var pairs = Qs.split("&");
for(var i = 0; i < pairs.length; i++){
    var pos = pairs[i].indexOf('=');
    if(pos!==-1){
        var paramName = pairs[i].substring(0,pos);
        if(paramName==='fromParent'){
            fromParent=true;
            break;
        }
    }
}

if(fromParent){
    alert("From Parent");
}else{
    alert("NOT From Parent");
}

这种方法不是100％万无一失，因为用户可以输入与父页面链接相同的URL。为了更好的准确性，首先检查document.referrer，如果没有设置，请使用我上面概述的方法

Answer 5

intelligent rendering with jQuery

使用@Rino Raj答案后，我注意到它需要改进。

在javascript中，load（）或onload（）事件通常要慢得多，因为它会在执行附加功能之前等待所有内容和图像加载。

当DOM或所有标记内容，JavaScript和CSS（而不是图像）完全加载后，就会执行附加到jQuery ready（）事件的事件。

让我根据代码解释这一点。当我将@Rino Raj的代码与load（）事件一起使用时，它可以工作，但是在第二个/被调用的页面上，内容出现在添加class =“ hide fade”之前（我不是真的想要）。

然后，我使用ready（）事件重构了代码，是的，我打算隐藏/淡入的内容根本没有出现。请按照下面的代码掌握概念。

<!-- Parent/caller page -->
<script type="text/javascript">
  $(document).ready(function() {
    sessionStorage.setItem('dontLoad', 'true');
  });
</script>

<!-- Second/called page -->
<script type="text/javascript">
  $(document).ready(function() {
    if(sessionStorage.getItem('dontLoad') == null) {
      $("#more--content").removeClass("hide fade");
    } else {
      $("#more--content").addClass("hide fade");
    }
  });
</script>

如果用户来自网站上的上一页，那么这样做，否则就这样做

5 个答案: