当页面重新加载数据消失时，PHP div 项目单击

Question

我有一个div名称所有联系人，当我单击任何人时，其中有很多名称 这个名字 在其他div名称接收器中显示我，它的工作很好问题是当页面重新加载名称时，我单击的接收者div Div 请告诉我如何在页面刷新时制作div 数据直到我转到其他页面。

#usersOnLine { 
font-family:tahoma;
font-size:12px;
color:black;
border: 3px teal solid;
height: 625px;
width: 300px;
overflow-y:scroll;
}
<div id='receiver'>
<h3>receiver</h3>
<!-- NOTICE THAT THIS IS NEW NOW... -->
<!-- IT IS IMPORTANT THAT YOU HAVE THIS PARAGRAPH EXACTLY AS IT IS HERE -->
<p class='bubbled-data'></p>
</div>
<div id = 'contact'>
    <h1 align="left"> all contacts </h1>
    <div id="usersOnLine">
        <h2>
            <?php
            foreach ($result as $key => $val) {
                echo "<span class='clickAble'>" . $val['email'] . "</span>";
                echo "<br>";
                echo "<br>";
            }
            ?>
        </h2>
    </div>
</div>
</div>
<!-- JAVASCRIPT - JQUERY -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script type="text/javascript">
    (function ($) {
        $(document).ready(function (e) {
            var receiver = $("#receiver");
            var clickAbles = $(".clickAble");
            // BIND THE clickAble SPAN TO AN ON-CLICK EVENT...
            // SO THAT WITH EACH CLICK, YOU CAN SIMPLE APPEND THE CONTENT OF THAT SPAN TO THE RECEIVER DIV
            clickAbles.on("click", function (evt) {
                var nameValue = $(this).text();
                receiver.find(".bubbled-data").text(nameValue);
                $("#reciver_email").val(nameValue);
            });
        });
    })(jQuery);
</script>

Answer 1

所以你想在页面重新加载后在接收器div 中保留名称。

您可以使用html本地存储，

参考 HTML 本地存储对象

<script type="text/javascript">
    (function ($) {
        $(document).ready(function (e) {
            var receiver = $("#receiver");
            var clickAbles = $(".clickAble");
            if(window.performance)
            {
               if(performance.navigation.type  == 1 )
               {
                  var nameValue = localStorage.getItem("nameValue");
                  receiver.find(".bubbled-data").text(nameValue);
                  $("#reciver_email").val(nameValue);
                  receiver.find(".bubbled-data").text(nameValue);
               }
            }
            // BIND THE clickAble SPAN TO AN ON-CLICK EVENT...
            // SO THAT WITH EACH CLICK, YOU CAN SIMPLE APPEND THE CONTENT OF THAT SPAN TO THE RECEIVER DIV
            clickAbles.on("click", function (evt) {
                var nameValue = $(this).text();
                receiver.find(".bubbled-data").text(nameValue);
                $("#reciver_email").val(nameValue);
                localStorage.setItem("nameValue", nameValue);
            });
        });
    })(jQuery);
</script>

试试这个。