如果你移动到另一个页面并将弹出数据带到另一个页面,如何弹出弹出窗口?

时间:2017-03-21 13:10:18

标签: javascript jquery html css popup

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

当我移动到另一个页面时弹出窗口弹出我正在使用 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>

1 个答案:

答案 0 :(得分:1)

&#13;
&#13;
$("#call_log").click(function(e) {
  //localStorage.timerpopup="active";
  document.getElementById("test").style.display = "block";
});
$("img.close").click(function(e) {
  $("#test").fadeOut();
});
&#13;
#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;
}
&#13;
<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>
&#13;
&#13;
&#13;