Problem z zasięgiem działania Java Script (przy PHP)

0

Witam. Mam plik index.php
i skłąda się trzech części które includuje.
header.php
middle.php i
footer.php.

W sekcji header wrzuciłem link do pliku z JS.

Skrypt zmienia styl określonych znaczników ID.

Okazuje się, że nie sięga do ty tego kodu HTML który generuje mi middle.php.

Sięga (I WYPŁYWA NA) tylko do tego kodu który jest w INDEX.PHP.

Pojawia się problem zasięgu działania Java Scriptu przy includowaniu fragmentów do głównego pliku index.php.

Dodam tylko jeszcze taką wiadomość, że część middle.php łączy się z bazą danych i generuje skrypt na podstawie wyników przeszukania bazy danych.

Czy mam zrobić, żeby Java Script objął swoim działaniem cały skrypt... inkludowane do index.php fragmenty.

Co mam <script src="..."></script> umieść osobno w pliku inkludowanym?

Czy też może trzeba bezpośrednio w pliku js... zastosować jakąś sztuczkę.

Stanąłem przed problemem programistycznym który nawet mi się w głowie nie mieści. Próbuję sobie jakoś wyobrazić jak działa JavaScript... Wychodzi na to, że integruje się tylko z "głównym i podstawowym HTMLem" na danej stronie i już nie wchodzi w interakcje z kodem generowanym przez PHP. Nie wiem.

Błagam pomóżcie. Już może nie dzisiaj bo jest 23:44... ale może jutro. No chyba, ze nie możecie spać.

Dzięki serdecznie. Pozdrawiam.
Kuba

3

Co rozumiesz przez: "nie obejmuje zasięgiem"?

Przyczyna na pewno nie leży tam, gdzie się jej doszukujesz.
JS działa na wygenerowanym html i nie jest w stanie w żaden sposób odróżnić, które elementy pochodzą z jakich plików.

Obstawiam, że po odwołujesz się do czegoś w JS przed zadeklarowaniem danego elementu w html. Coś w stylu:


<script>
document.getElementById("test").value ="123";
</script>
<input id="test">
0
Freja Draco napisał(a):

Co rozumiesz przez: "nie obejmuje zasięgiem"?

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Test</title>
        
        
        <script src="index.js"></script>
        
    </head>
    <body>
       
         <button onClick="hideImages()">Hide</button>
        <button onClick="showImages()">Show</button>
          
        <p id="imageState" style="display:block;">I'm going to the mountains!</p>
         
    </body>
</html>

Oto absolutne podstawy Java Scriptu.

function showImages() {
    
    document.getElementById("imageState").style.display = 'block';
    
}

function hideImages() {
    
    document.getElementById("imageState").style.display = 'none';
    
}

I to działa pięknie. Tu jest przykład. http://mindriver.pl/js/

W pliku index.php natomiast... tj. w głównym pliku mojego programu mam taki fragment.

<div id="imageState" style="displayBlock"> i obrazek z linkiem tu </div> 

Drugiegow diva mam w znaczniku <center></center> ten drugi div jest generwoany przez pętle php na podstawie wyników z bazy danych. Pierwszy div natomiast jest statycznie zapisany bezpośrenio w w index.php, a nie w includedzie - który jeszcze wywołuje pętle i generuje kto.

Mój JS sięga tylko do tego statycznego zapisu bezpośrednio z index.php - na tego drugiego DIVa po prostu nie wpływa w żaden sposób przyciskanie guzików. Style się nie zmienia z "block" na "none". I co zrobić?

Pozdrawiam
Kuba

1

Wypluj z siebie kod który "nie działa". Z Fusów mamy wróżyć coś tam naklepał?

0
hzmzp napisał(a):

Wypluj z siebie kod który "nie działa". Z Fusów mamy wróżyć coś tam naklepał?

Za chwilę się zdenerwuję.

Konsola wywala mi tyle błędów, że się idzie zrzygać, a wg mnie kodzik jest bardzo zgrabny. Wszystko co mogłem wam opisać już opisałem. Możecie to przemyśleć? Wejdźcie sobie na MindRiver.pl i kliknijcie hideLogo... ukryje się tylko logo środkowego znaczku Mercedesa. Ten na samym dole się nie ukryje.

Jego kod nawet nie jest generowany przez żaden skrypt. Jest to statyczny kod, tylko nie bezpośrednio w INDEX.PHP tylko w INCLUDE('FOOTER');

Jak wam cokolwiek przyjdzie do głowy to piszcie śmiało.
Dziękuję bardzo i pozdrawiam.
Kuba

<div id="imageState" style="display:block;">
      
            <br>
            <a href="https://www.mercedes-benz.com/en/" target="_blank"><img src="/ad/01.jpg5EBB33E9-BC54-41D7-9CD6-0C05D46E08E2Zoom.jpg" title="Prada+Benz" alt="" width="600"><br><br><br><br></a> 
            
           </div>

To jest kod z FOOTER.PHP który nie działa! (Footer.php jest includowany do index.php)

To jest kod z INDEX.PHP który działa!

<div id="imageState" style="display:block;">
      
            <br>
            <a href="https://www.mercedes-benz.com/en/" target="_blank"><img src="/ad/01.jpg5EBB33E9-BC54-41D7-9CD6-0C05D46E08E2Zoom.jpg" title="Prada+Benz" alt="" width="600"><br><br><br><br></a> 
            
           </div>

Jak widzicie te kody są takie same.

Jak się ma działanie JavaScriptu nie osadzonego w <style> strony tylko importowanego z zewnętrznego pliku JS do dokumentu index.php - do includowanych do index.php skryptów?

0
Jakub Prażmowski napisał(a):

Za chwilę się zdenerwuję.

Jak się ma działanie JavaScriptu nie osadzonego w stylu strony (lecz importowanego z zewnętrznego pliku .JS) do includowanych do index.php jego części składowych? (np. header.php main.php footer.php)

1

Masz dwa elementy o identycznym id imageState.
To podstawowy błąd, a skrypt manipulujący widocznością złapie tylko jeden z nich.

1
Jakub Prażmowski napisał(a):

Jak się ma działanie JavaScriptu nie osadzonego w <style> strony tylko importowanego z zewnętrznego pliku JS do dokumentu index.php - do includowanych do index.php skryptów?

Nijak. JS nie osadza się w CSS :p

Poza tym powtórzę: JS pracuje na wygenerowanym HTML i nie ma pojęcia o tym, z jakich plików PHP był on generowany.

Jakub Prażmowski napisał(a):

A ja powtórzę że z teorii jesteś dobry.
Rozumiesz, że mam dwa takie same fragmenty kodu!!!! ? Rozumiesz?
I że jeden działa a drugi nie działa?

I co powiesz?
Dalej to samo?

Przeczytaj ponownie moją odpowiedź odnośnie identycznych ID.
Zrozum moją odpowiedź odnośnie identycznych ID.
Nie wykłócaj się ze mną (ani z konsolą).

0

Przeczytaj ponownie...

Poczekaj. Każdemu elementowi mam nadawać inne unikalne ID?
Oszalałeś?

A słyszałeś o # w CSS?

2
Jakub Prażmowski napisał(a):

Przeczytaj ponownie...

Poczekaj. Każdemu elementowi mam nadawać inne unikalne ID?
Oszalałeś?

.

The id attribute specifies a **unique **id for an HTML element (the value must be unique within the HTML document).

https://www.w3schools.com/html/html_id.asp

A słyszałeś o # w CSS?

O czym?

2
Jakub Prażmowski napisał(a):

Przeczytaj ponownie...

Poczekaj. Każdemu elementowi mam nadawać inne unikalne ID?

Tak. Id musi być unikalne

A słyszałeś o # w CSS?

Dlatego do CSS używa się klas a nie ID. Używanie ID do CSS jest uważane za błąd

2

Przecież nie będę dla każdego robił osobnej funkcji... czyli co... jak mam JavaScriptem sięgnąć do klasy a nie do ID?

https://www.w3schools.com/jsref/met_document_getelementsbyclassname.asp

var x = document.getElementsByClassName("example");

lub za pomocą JQuery

0

https://www.w3schools.com/jsref/met_document_getelementsbyclassname.asp

var x = document.getElementsByClassName("example");
function showImages() {
    
    document.getElementsByClassName("imageState").style.display = 'block';
    
}

Tak?

function hideImages() {
    
    document.getElementsByClassName("imageState").style.display = 'none';
    
}
4
Jakub Prażmowski napisał(a):

Tak?
document.getElementsByClassName("imageState").style.display = 'none';

Nie. document.getElementsByClassName tworzy kolekcję obiektów.
Style możesz przypisywać tylko do pojedynczych obiektów, więc musisz tę kolekcję przelecieć pętlą.

1 użytkowników online, w tym zalogowanych: 0, gości: 1