我怎么知道显示div：浏览器的两个或多个选项卡中没有显示？

Vikas Kumar 发表于 Dev

维卡斯·库玛（Vikas Kumar）

考虑我有此页面：sample.php

<div id="id1" style="display: none">
Hello
</div>

最初，当页面加载时，此div不会显示，但是我有一个button1。当我单击此按钮时，它将显示值更改为block。

我还有另一个button2可以用来将显示值改回none。

因此，该div仅在单击button1时可见。在其他情况下（重新加载页面或单击button2时），该页面将不可见。

现在，假设我已经在浏览器的另外4个标签中打开了相同的页面（它甚至可以更多，我仅举一个例子）。我已经按了其中任意两个按钮。这意味着该div在这两个选项卡中可见。

现在，我想要的是，当div可见时，其内部的文本应存储在SESSION变量中。而且我可以使用JavaScript，jQuery，Ajax和PHP来做到这一点。当两个选项卡具有2个可见的div时，它们的文本“ Hello ”存储在相同的SESSION变量中（它将仅存储“ Hello”，而不存储“ Hello Hello”，因为SESSION将被新请求替换，因为我的Ajax和PHP代码将同时在所有标签上运行）。

现在，我最后需要的是，当在2个“差异”选项卡中的这2个可见div设置为显示时：none，它应该取消设置其中包含“ Hello”的SESSION变量。

因为我要取消设置的条件是4个选项卡中的任何一个都不应该使该div可见。如果任何选项卡的div可见，则SESSION中将带有“ Hello”。

PS：我已经尽力解释了我的问题，但是如果您仍然不明白，请在回答之前在评论中提及：

谢谢你。

oop鱼

在此代码中，当单击button1或show button时，它将把数据发送到new.php。

该new.php将设置会话variable.I必须使用另一个会话变量数为以标签的数量，它是可见的计数。

当隐藏按钮被点击时，POST请求被发送和会话变量count是reduced.When计数变量被降低为0时，不存在更多的标签，其中它是visible.So会话被破坏

这是代码：

HTML：

 <html>
 <head>
 <script src="jquery/jquery-1.12.2.min.js"></script>
 <script>
 $(document).ready(function(){

 $("#show").click(function(){
   $("#id1").css("display","block");
   var x=$("#id1").text();
   $.post("new.php",{val: x});
 });

 $("#hide").click(function(){
   $("#id1").css("display","none");
   $.post("new.php");

});
 });
 </script>
 </head>
<body>
  <div id="id1" style="display: none">
  Hello
  </div>
 <button type="button" id="show">show</button>
 <button type="button" id="hide">Hide</button>

 </body>
  </html>

new.php：

<?php
session_start();

if(!empty($_POST["val"]))
{
  if(!isset($_SESSION["val"]))
  {
    $_SESSION["val"]=$_POST["val"];
    $_SESSION["count"]=1;
   }
  else {
    $_SESSION["count"]+=1;
  }
}
else
{
  if(isset($_SESSION["val"]))
  {
    if($_SESSION["count"]==1)
    {
      session_destroy();
    }
   else {
     $_SESSION["count"]-=1;

    }
 }
 }


 ?>