在不同的HTML页面上显示/隐藏div

Question

基本上我有两个不同的HTML页面。 我想创建一个函数，当第一个HTML页面上的按钮被点击时，它将显示/隐藏第二个HTML页面上的div元素。

这可以用JavaScript完成吗？

提前致谢。

- Cal B

---

如何拥有两个HTML页面？您可以使用Ajax并在同一页中加载。当第二个页面加载时，一切都将是新鲜的，请告诉我们您的确切要求。 - kobe

这两个网页是否同时打开？它们来自同一个域吗？一个是打开了另一个吗？ - Ash Burlaczenko

两个网页都在同一台电脑上打开吗？ - marcos.borunda

你可以使用 localStorage 存储你的更改，并在新页面加载时重新调用它们。 - Roko C. Buljan

Answer 1

如@roXon所述，您可以使用HTML5存储来实现此操作。

例如：

if(typeof(Storage)!=="undefined")
  {
     $('#FirstClick').on('click',function(){
        localStorage.clickedDiv = $(this).attr('id');
        $(this).hide();
     });
  }
else
  {
     $(this).hide();
  }

然后在第二页。

$(function(){
   $(localStorage.clickedDiv).hide();
});

或者为了更好地支持旧版浏览器，您可以使用 cookies。

- dev

Answer 2

如果浏览器支持HTML5存储，您可以保存一个变量http://www.w3schools.com/html/html5_webstorage.asp。

否则，您需要传递GET参数或cookie。

- Ciack404

Answer 3

我不确定你所说的第二个HTML页面是什么意思，也许你指的是内容？使用jQuery可以实现这一点......例如......

<script type="text/javascript">

$(document).ready(function(){

        $(".slidingDiv").hide();
        $(".show_hide").show();

    $('.show_hide').click(function(){
    $(".slidingDiv").slideToggle();
    });

});

</script>

<a href="#" class="show_hide">Show/hide</a>
<div class="slidingDiv">
<a href="#" class="show_hide">hide</a></div>

css

.slidingDiv {
    height:300px;
    background-color: #99CCFF;
    padding:20px;
    margin-top:10px;
    border-bottom:5px solid #3399FF;
}

.show_hide {
    display:none;
}

也许你想在第二个页面上加载内容（或与其交互），请参见http://api.jquery.com/load/和问题：在另一页上加载div的内容。

- Glyn Jackson

---

你确定不建议使用更新的版本吗？而且这句话怎么回答问题呢？ - Roko C. Buljan

我很确定这不是问题所问的。他问的是当在第一页上点击一个项目并重定向到第二页时...在第二页上隐藏第一页上单击的项目。是的，1.3.2有点过时了。 - dev

抱歉，这是我之前的代码，只是复制粘贴而已。更新过了，应该可以在最新版上运行。 - Glyn Jackson