javascript - 即使您移动到另一个页面并将弹出数据带到另一个页面，如何使弹出窗口弹出？

Question

我在弹出窗口中有一个提交表单，我的要求是弹出窗口及其数据保持不变，即使我移动到另一个页面，直到我提交表单数据弹出窗口应该显示在所有包含内容的页面上。

为了在我移动到另一个页面时保持弹出窗口弹出，我正在使用 localstorage 但我无法获取弹出数据

$("#call_log").click(function(e) {
  //localStorage.timerpopup="active";
  document.getElementById("test").style.display = "block";
});
$("img.close").click(function(e) {
  $("#test").fadeOut();
});

#test {
  background: lightgrey;
  padding: 10px;
  position: relative;
  padding-top: 20px;
  top: 100px;
  width: 450px;
  border: 5px solid #ddd;
}

img.close {
  position: absolute;
  right: 0px;
  top: 0px;
  height: 30px;
  width: 30px;
  cursor: pointer;
}

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input type="button" value="Call log" id="call_log">
<div id="test" style="display: none;">
  Submit form
  <form action="save_popup_data.php" method="post">
    <input type="text" name="currenturl" id="currenturl" value="12345">
    <input type="text" name="starttime" id="starttime" value="3.00">
    <input type="text" name="endtime" id="endtime" value="4.00">
    <input type="text" name="duration_hours" id="duration_hours" value="1">
    <input type="text" name="duration_minutes" id="duration_minutes" value="30">
    <input type="submit" name="save" id="save" value="Save" style=" padding: 5px 15px;">
  </form>
  <img class="close" src="https://cdn3.iconfinder.com/data/icons/status/100/close_4-512.png" alt="">
</div>

Answer 1

$("#call_log").click(function(e) {
  //localStorage.timerpopup="active";
  document.getElementById("test").style.display = "block";
});
$("img.close").click(function(e) {
  $("#test").fadeOut();
});

#test {
  background: lightgrey;
  padding: 10px;
  position: relative;
  padding-top: 20px;
  top: 100px;
  width: 450px;
  border: 5px solid #ddd;
}

img.close {
  position: absolute;
  right: 0px;
  top: 0px;
  height: 30px;
  width: 30px;
  cursor: pointer;
}

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input type="button" value="Call log" id="call_log">
<div id="test" style="display: none;">
  Submit form
  <form action="save_popup_data.php" method="post">
    <input type="text" name="currenturl" id="currenturl" value="12345">
    <input type="text" name="starttime" id="starttime" value="3.00">
    <input type="text" name="endtime" id="endtime" value="4.00">
    <input type="text" name="duration_hours" id="duration_hours" value="1">
    <input type="text" name="duration_minutes" id="duration_minutes" value="30">
    <input type="submit" name="save" id="save" value="Save" style=" padding: 5px 15px;">
  </form>
  <img class="close" src="https://cdn3.iconfinder.com/data/icons/status/100/close_4-512.png" alt="">
</div>