Kod Javascript nie wykonuje się po użyciu funkcji jquery .load()

pytanie zadane 29 grudnia 2019 w JavaScript przez niosek Nowicjusz (160 p.)

Chcę zbudować witrynę bez odświeżania w WordPress. Przetestowałem funkcję .load() i widzę, że kod javascript nie działa drugi raz po wywołaniu jquery .load(). Przy pierwszym uruchomieniu javascript tak, po raz drugi nie.

Mam kod:

<div class="container">

  <div class="some1"> block of content 1</div>

<script type="text/javascript">
      alert("Hello");
 </script>

  <div class="some2"> block of content 2</div>

</div>

I wywołuję funkcję po kliknięciu przycisku w jquery:

jQuery( "#btn" ).click(function() {

jQuery(".container").load(location.href + " .container");      

});

Jak to naprawić, aby kod js był wykonywany za każdym razem?

1	komentarz 29 grudnia 2019 przez Tomek Sochacki Ekspert (227,490 p.) location.href + " .container" co Ty tu chcesz zrobić?

2 odpowiedzi

odpowiedź 29 grudnia 2019 przez niosek Nowicjusz (160 p.)

Chciałbym odświeżyć przy użyciu .load() blok div "container".

komentarz 29 grudnia 2019 przez Tomek Sochacki Ekspert (227,490 p.)

Co znaczy odswiezyc, chcesz jakos dynamicznie zmienic jego zawartosc czy co? I odp najlepiej jako komentarz a nie nowa odp.

komentarz 29 grudnia 2019 przez niosek Nowicjusz (160 p.)

Chciałbym dynamicznie zmienić jego zawartość.

To znaczy:

Użyć wcześniej :

window.history.pushState("object or string", "Title", "/new-url");

Żeby zmienić adres url bez odświeżania i wykonać funkcję load(), która odświeży mi blok div z html i javascript. Odświeży to znaczy z tymi parametrami url z historii, jak powyżej.

Wszystko działa ok tylko kod javascript nie wykonuje się po użyciu funkcji load()

komentarz 29 grudnia 2019 przez niosek Nowicjusz (160 p.)

funkcja load() odświeża DIV z wypisanymi w pętli foreach wynikami, które zawierają kod JS.

komentarz 29 grudnia 2019 przez Tomek Sochacki Ekspert (227,490 p.)

Jezu co Ty chcesz przekkmbinowac:) chodzi.Ci o.zrobienie SPA z wlasnym routingiem czy co? Bo kompletnie nie rozumiem tego ostatniego komentarza...

komentarz 29 grudnia 2019 przez niosek Nowicjusz (160 p.)

Chciałbym zrobić stronę, która działa bez przeładowania i wszystko działa tylko po wywołaniu funkcji .load() jquery nie wykonują się skrypty js w tym bloku, a reszta jest OK:

<div class="container">
  <div class="some1"> block of content 1</div>
<script type="text/javascript">
      alert("Hello");
 </script>
  <div class="some2"> block of content 2</div>
</div>

komentarz 29 grudnia 2019 przez niosek Nowicjusz (160 p.)

Czemu po wywołaniu funkcji .load() nie wykonują się skrypty zawarte w ładowanym elemencie?

komentarz 29 grudnia 2019 przez Tomek Sochacki Ekspert (227,490 p.)

Poczytaj sobie dokladnie dokumentacje metody load z jQuery.

komentarz 29 grudnia 2019 przez niosek Nowicjusz (160 p.)

A mógłbym prosić o rozwiązanie, bo przejrzałem sporo, ale odpowiedzi się nie doszukałem, a sporo ludzi ma z tym problem?

komentarz 29 grudnia 2019 przez Tomek Sochacki Ekspert (227,490 p.)

Nie wiem o jakie rozwiazanie Ci chodzi bo string jaki podajesz w metodzie load jest bez sensu dlatego napisalem abys poczytal dokumentacje i zobaczyl co ta metoda robi i jakie przyjmuje parametry...

komentarz 29 grudnia 2019 przez niosek Nowicjusz (160 p.)

OK, ale kierunek myślenia mam dobry, jeśli chodzi o stworzenie strony bez odświeżania, czyli metody load() oraz historia w javascript?

odpowiedź 29 grudnia 2019 przez antypop Mądrala (5,730 p.)

http://www.w3bai.com/pl/jquery/ajax_load.html

To co chcesz zrobić wydaje mi się bez sensu, jak chcesz zrobić SPA i zmieniać sobie elementy bez przeładowywania strony to się zakręć wokół jakiegoś reaktywnego frameworka, podpowiem że najniższy próg wejścia ma Vue.js.

wprowadzenie do vue na szybko : https://www.youtube.com/watch?v=PmlipEkFSOk

Pozdrawiam