隐藏的内容仍在后台运行

Hidden content still runs in the background

本文关键字：后台 运行 隐藏      更新时间：2023-09-26

我已经设法隐藏了一些内容，并使用jQuery中的hide和show函数显示了这些内容。

我所看到的是，当我显示它并修改为更改内容中的日期时，当我隐藏并再次显示它时，它仍然保持不变。

另一件事是，我已经验证了它，这样如果用户点击过去的日期，就会出现错误。现在，如果我隐藏这个日期内容，它应该不会给我任何错误。但它确实存在，这表明它仍然存在，只是我们看不见。我真的可以隐藏并禁用它，这样它就完全消失了，被禁用了吗？

$(function() {
  $("#date1, #date2").datepicker();
});
$("#date1, #date2").datepicker({
  dateFormat: 'dd-M-yy',
});
$("#Return").click(function() {
  $("#hidden-logo").hide();
  $("#hidden-col").show();
});
$("#Single").click(function() {
  $("#hidden-col").hide();
  $("#hidden-logo").show();
});
#hidden-col,{
  float: initial;
  display: none;
  width: 100%;
}
<!DOCTYPE html>
<html>
<head>
  <title>TrainLine</title>
  <!--Title of the booking system-->
  <meta name="viewport" content="width=device-width">
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
  <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
</head>
<div class="half-col">
  <label class="center-label">OUT</label>
  <!---Centering label "OUT"--->
  <input type="text" id="date1" name="user_date">
  <!---Input type of text for a custom datepicker calender--->
  <label id="PastDateError"></label>
  <select name="time" class="time" id="leavingtime">
    <option value="1">00:00</option>
    <option value="2">01:00</option>
    <option value="3">02:00</option>
    <option value="4">03:00</option>
    <option value="5">04:00</option>
    <option value="6">05:00</option>
    <option value="7">06:00</option>
    <option value="8">07:00</option>
    <option value="9">08:00</option>
    <option value="10">09:00</option>
    <option value="11">10:00</option>
    <option value="12">11:00</option>
    <option value="13">12:00</option>
    <option value="14">13:00</option>
    <option value="15">14:00</option>
    <option value="16">15:00</option>
    <option value="17">16:00</option>
    <option value="18">17:00</option>
    <option value="19">18:00</option>
    <option value="20">19:00</option>
    <option value="21">20:00</option>
    <option value="22">21:00</option>
    <option value="23">22:00</option>
    <option value="24">23:00</option>
  </select>
  <label id="errordate1"></label>
  <!--Radio buttons for single and return ---->
  <input type="radio" id="Single" checked="checked" name="Type1" value="Single">
  <label class="light">Single</label>
  <input type="radio" id="Return" name="Type1" value="Return">
  <label class="light">Return</label>
  <!--        <button onclick="FadeIn('div1)">Fade in</button>-->
</div>
<!------------END OF OUT(SINGLE) CONTAINER--------->
<img src="img/main-logo.png" class="half-col" id="hidden-logo">
<!------------RETURN CONTAINER--------->
<div id="hidden-col">
  <label class="center-label">RETURN</label>
  <div id="flexContainer">
    <input type="text" id="date2" name="user_date">
    <button type="NextDay" id="nextday" value="next day" onclick="NextDayFunction()">
      <img src="img/arrow-button.png" height="40px" width="45px" alt="Arrow Icon">
    </button>
  </div>
  <select name="Location" class="time" id="leavingtime">
    <option value="1">00:00</option>
    <option value="2">01:00</option>
    <option value="3">02:00</option>
    <option value="4">03:00</option>
    <option value="5">04:00</option>
    <option value="6">05:00</option>
    <option value="7">06:00</option>
    <option value="8">07:00</option>
    <option value="9">08:00</option>
    <option value="10">09:00</option>
    <option value="11">10:00</option>
    <option value="12">11:00</option>
    <option value="13">12:00</option>
    <option value="14">13:00</option>
    <option value="15">14:00</option>
    <option value="16">15:00</option>
    <option value="17">16:00</option>
    <option value="18">17:00</option>
    <option value="19">18:00</option>
    <option value="20">19:00</option>
    <option value="21">20:00</option>
    <option value="22">21:00</option>
    <option value="23">22:00</option>
    <option value="24">23:00</option>
  </select>
  <label id="errordate2"></label>
</div>
<input type="button" value="subbmit">

使用.remove（）方法。但是，对于当前页面加载，您将无法真正撤消此操作。

$("#Return").click(function() {
  $("#hidden-logo").remove();
  $("#hidden-col").show();
});

如果你想撤消.remove（），那么就按照这个家伙的建议做一些事情：）https://stackoverflow.com/a/1255562/1661464

相关文章：