Когда я обновляю sh страницу, код Jquery не работает

Question

Я реализовал AJAX код, который вызывает внешнюю страницу в PHP, где запрашивается БД и создает таблицу. Когда AJAX вызывает страницу, код jQuery вставляет таблицу PHP в тег <p>, который создает своего рода «прямоугольник» в анимации и изменяет размер поля на HEIGHT в соответствии с таблицей PHP. Когда он вызывается в первый раз, он работает правильно, когда я затем закрываю «ящик» с помощью соответствующей кнопки и снова нажимаю на него, чтобы просмотреть окно, последний остается заблокированным со стандартной высотой тега <p>, с которым он был определен. Как я могу исправить это и заставить работать каждый раз, когда я запускаю анимацию jQuery без необходимости обновлять sh страницу?

<input type="button" value="Close Ripostiglio" class="hidden1" onclick="close1()">
    <p class="par1" id="pa1"> Ripostiglio </p>
    <script>
    function loadDocument(e) {
      var httpRequest = new XMLHttpRequest();
      httpRequest.onreadystatechange = gestisciResponse;
      httpRequest.open("GET","function.php", true);
      httpRequest.send();
      httpRequest.reload();
    }
    function gestisciResponse(e) {
      if (e.target.readyState == 4 && e.target.status == 200) {
        document.getElementById("dinamicZone").innerHTML = e.target.responseText;
      }
    }
                    //OPEN BOX
      $(document).ready(function(){
        //RIPOSTIGLIO
        $(".par1").click(function right(){
          var p = $(".par1");
          var n = $(".hidden1");
          p.animate({left: '300px'}, "slow");
          p.animate({height: '$(#dinamicZone).height()'}, "slow");
          p.animate({width: '350px'}, "slow");
          p.html("<div id='dinamicZone'></div>");
          setTimeout(loadDocument, 2000); //delay the open of table
          n.show();
        });
        function close1(){
        $(".nascosto1").click(function destra(){
          var p = $("#pa1");
          var p = $(".par1");
          var c = $(".hidden1");
          var s = $(".add1");
          p.animate({height: '65px'}, "slow");
          p.animate({width: '150px'}, "slow");
          p.animate({left: '0px'}, "slow");
          s.hide();//TOLGO LA SCRITTA AGGIUNGI
          p.html("Ripostiglio"); //"RIMETTO" FORZATAMENTE LA SCRITTA CANTINETTA VINI
          c.hide();
        });
      }
</script>

Answer 1

Объект dinamicZone был уничтожен в close1 (). Поэтому, когда вы нажимаете на него снова, он не имеет ссылки на изменение размера. Перезагрузка страницы приведет к повторной инициализации страницы, таким образом воссоздавая dinamicZone.

Возможно, измените строку в close (), где вы переназначаете значение p. HTML. Если вы закомментируете эту строку, изменение размера должно работать.

---- игнорировать ниже этого ----

Without it, you're trying to set the height to 65 when it contains an object that is higher, which is probably why it did not work. 

```
 $(".nascosto1").click(function destra(){
          // var p = $("#pa1");  // duplicate
          var p = $(".par1");
          var c = $(".hidden1");
          var s = $(".add1");
          p.html("Ripostiglio"); //"RIMETTO" FORZATAMENTE LA SCRITTA CANTINETTA VINI
          p.animate({height: '65px'}, "slow");
          p.animate({width: '150px'}, "slow");
          p.animate({left: '0px'}, "slow");
          s.hide();//TOLGO LA SCRITTA AGGIUNGI
          c.hide();
        });
```