Question

我设法隐藏了一些内容，并设法使用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">

Answer 1

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

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

如果你想要撤消.remove（），那就做一些像这个人推荐的东西:) https://stackoverflow.com/a/1255562/1661464

隐藏内容仍在后台运行

1 个答案: