PHP + JQuery – Hoe deze twee samen te gebruiken? Zie mijn voorbeeld

Ik heb een op php gebaseerde website. Zoals in, alle pagina’s html worden uitgevoerd via php.

Hier is een eenvoudig voorbeeld:

<?php
ob_start();
$pageStart = '
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MY WEBSITE PAGE</title>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>

Wat ik zou willen doen is gebruik maken van wat jQuery op deze pagina.

Mijn eerste poging was natuurlijk om het script in de php-variabele op te nemen, zoals:

<?php
ob_start();
$pageStart = '
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
    var datefield=document.createElement("input")
    datefield.setAttribute("type", "date")
    if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
        document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
        document.write('<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
        document.write('<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
    }
</script>
<script type="text/javascript">
if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
    jQuery(function($){ //on document.ready
        $('#birthday').datepicker();
    })
}
</script>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>

Nu gebruik ik de code-editor van Dreamweavers, die dankzij de functie voor het markeren van syntaxis zal wijzen op de massa’s syntaxisfouten die hierin worden geproduceerd.

Dus ik probeerde eerst deze fouten eruit te halen. Dit is mislukt.

Dus ik heb geprobeerd de “s in ‘s te veranderen, en omgekeerd, totdat de fouten verdwenen waren. Dit mislukte ook omdat het erop lijkt dat het script niet op deze manier valideert.

Dus ik las een paar tutorials en vond deze:

JavaScript en PHP kunnen elk een groot potentieel bieden voor elke inspanning voor webontwikkeling, maar ze spelen niet altijd leuk samen. Lees over de problemen.

En zoals ik het begrijp, is dat je de js moet opnemen in plaats van het rechtstreeks als onderdeel van je php te hebben.

Dus heb een bestand met de naam page.php en een ander met de naam jquery.php. Dus besloot ik te proberen dit idee aan te passen aan mijn probleem.

Dus ik begon met zoiets als dit – index.php:

<?php
ob_start();
$pageStart = '
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MY WEBSITE PAGE</title>
'. include $_SERVER['DOCUMENT_ROOT'] . '/../../path/to/include/datepicker.php'.'
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>

en – DATEPICKER.PHP:

<script language="Javascript">
    var datefield=document.createElement("input")
    datefield.setAttribute("type", "date")
    if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
        document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
        document.write('<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
        document.write('<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
    }
</script>
<script language="Javascript">
if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
    jQuery(function($){ //on document.ready
        $('#birthday').datepicker();
    })
}
</script>

Nu zijn er geen syntaxisfouten op de pagina, geweldig … dus ik probeer het, de helft verwachtte dingen om eindelijk gewoon te werken …

NOPE … FATALE FOUT: Mislukt om stream te openen: geen bestand of directory Blah Blah. Deze fout heeft betrekking op de omvatten die ik heb toegevoegd. Oké, hoewel het bestand er is, wordt het niet gevalideerd als PHP omdat er geen openende en sluiting van PHP-tags zijn.

Dus ik voeg ze toe … annnd … een pagina vol met syntaxisfouten opnieuw!

Dus mijn vraag is dit:

KAN SOMMIGE ENKEL ENKELIJKE KENNIS DEEL EN LEGEN ME GELDELIJK HOE DAT HET PROCES WERKT ECHT WERKT. Wat is de deal met alle syntaxisfouten en hoe moet u dit een taak vinden?

Ik geloof dat het mogelijk is, en ja, het zou makkelijker zijn als ik de hele HTML via PHP niet uitvoerde. Maar dit is een eenvoudig voorbeeld en mijn daadwerkelijke ontwerp is veel complexer. Het vereist dat de verschillende delen van de pagina worden opgesplitst in variabelen, om die bits en pines indien nodig, dynamisch te plaatsen.

Elke invoer, suggesties of inzicht zou zeer op prijs worden gesteld; en eventuele links naar pagina’s of tutorials die dit dekken, zou ook zeer op prijs worden gesteld.

Bedankt !!


Antwoord 1, Autoriteit 100%

Alles wat u hoeft te doen om jQuery met PHP te gebruiken, is het JQUERY Javascript-bestand op te nemen in uw HTML-document in de koptag. Ik gebruik de hele tijd PHP samen met jQuery. En dit is hoe ik het doe. In uw hierboven hierboven ziet het erop dat u wat ontsnappende problemen met uw code hebt. En het ziet er ook op alsof je de kop van de pagina in een PHP-variabele wilt houden en print het dan uit. Je hoeft niet alles te doen. Plaats gewoon de platte tekst in uw PHP-bestand zonder PHP-tags en het zal werken. Ook gebruik je een oude versie van jQuery. Moet waarschijnlijk de nieuwste versie gebruiken. Maar als u het heeft opgeslagen in een PHP-variabele, zodat u het kunt afdrukken, doet u dit:

Dus, hier is een code om u op weg te helpen.

<?php
$pageStart = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MY WEBSITE PAGE</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {
    $("#date").datepicker();
});
</script>
</head>
<body>
<input type="text" id="date" name="date" />
</body>
</html>';
print $pageStart;
?>

Antwoord 2, autoriteit 40%

<head>
<script type="text/javascript"
 src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
  $(document).ready(function() {
    // javascript & jquery code
    // even better would be if you would put client code in separate file!!!
  });
</script>
</head>
<body>
<?php
   echo "bla bla bla";
?>
</body>

en +1111 naar @ Heera’s reactie
Je mist de basis.


Antwoord 3, autoriteit 10%

Gebruik Heredoc. Duizenden syntaxisfouten zullen verdwijnen.

Bekijk de heredoc-versie van uw pagina’s,

  1. http://pastie.org/3412925
  2. http://pastie.org/3412929
  3. http://pastie.org/3412935// Hier heb je includecontacteren. includeretourneert niets. Het omvat gewoon. Dus het is anders veranderd.

Antwoord 4

Ik denk dat het zo moet zijn

. (include ($_SERVER['DOCUMENT_ROOT'] . '/../../path/to/include/datepicker.php')) .

anders zal php proberen alle dingen erna op te nemen totdat de l is bereikt (tags worden geïnterpreteerd als onderdeel van de bestandsnaam).

ook, in termen van de php-code, nadat het bestand is opgenomen (bij succes), vertaalt de include-instructie zich in 1 als een getal, in plaats van de inhoud van het bestand.

gebruik

<? $abc <<<qwerty
...
...
...
qwerty;
return qwerty;
?>

voor alle bestanden die u wilt opnemen

Other episodes