---
title: "Knyta samman PHP och JavaScript"
type: "forum-thread"
url: "https://www.webforum.nu/amne/php/134329-knyta-samman-php-och-javascript"
topic: "PHP"
topic_url: "https://www.webforum.nu/amne/php"
author: "kicki_an"
published: "2005-09-15T09:01:48.000Z"
updated: "2005-09-15T15:07:49.000Z"
replies: 6
views: 512
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/php/134329-knyta-samman-php-och-javascript"
---

# Knyta samman PHP och JavaScript

## #1 — kicki_an, 2005-09-15T09:01Z

Hejsan!

Jag undrar hur man kan kan knyta samman PHP-kod och JavaScript, tex använda PHP-variabler i Java-koden.
Jag har en statisk nyhetssida, som jag skulle vilja koppla till en databas och göra mer dynamisk. Problemet är att jag inte vet hur jag ska kunna använda värden jag plockat ut i php in i JavaScriptet.

Nedan är koden för den statiska sidan, som jag vill anpassa till en dynamisk lösning.

\<html\>
\<head\>
\<link href="content/inc/global.css" rel="stylesheet" type="text/css"\>
\<script\>
function toggle(e) { 		// kollar om lagret är på eller av
  if (e.style.display == "none") 
  {
     e.style.display = "block";
  } 
  else 
  {
     e.style.display = "none";
  }
}

function setDisplay()  //sätter none på alla så man slipper kolla fler gånger ovan
{
	nyhet1.style.display="none";
	nyhet2.style.display="none";
}

\</script\>

\<script src="content/inc/setheight.js" language="javascript" type="text/javascript"\>\</script\>
\</head\>
\<body onLoad="goSetHeight();setDisplay()"\>
\<table width="514" border="0" align="center" cellpadding="0" cellspacing="0"\>
  \<tr\> 
    \<td align="right"\>\<A href="javascript:window.print();"\>\<img src="images_tour/button_skrivut.gif" width="51" height="17" hspace="0" vspace="0" border="0"\>\</a\>&nbsp;\<a href="javascript:window.history.go(-1);"\>\<img src="images_tour/button_back.gif" alt="Tillbaka" width="69" height="17" hspace="0" vspace="0" border="0"\>\</a\>\</td\>
  \</tr\>
  \<tr\> 
    \<td valign="top"\>&nbsp;\</td\>
  \</tr\>
  \<tr\> 
    \<td valign="top"\> 
      \<!--Content, start--\>
      \<div class="divborder"\> 
        \<table width="100%" border="0" cellpadding="4" cellspacing="1" bordercolor="#EFEFEF"\>
          \<tr class="bluetop"\> 
            \<td bgcolor="#EFEFEF"\>\<strong\>Nyheter 2005\</strong\>\</td\>
          \</tr\>
          \<tr\> 
            \<td align="center" style="width:100%; height:2px; background-color='#E3EAF4'"\>\</td\>
          \</tr\>
          \<tr\>\<!--background-image: url(../../images_tour/form/form_newsheadbg.gif)--\> 
            \<td valign="top" onMouseOver="this.style.backgroundColor='#E3EAF4'" onMouseOut="this.style.backgroundColor='white'"\> 
          \<strong\>2005-09-13\</strong\> &nbsp; &nbsp; \<a href="#" onClick="toggle(nyhet1);goSetHeight();"\>Nya 
              avgifter p&aring; trafik\</a\>
              \<div id="nyhet1" class="news" onClick="nyhet1.style.display='none'" title="Klicka för att stänga nyheten!"\> 
                \<strong\>\<img src="images_tour/form/form_news_close.gif" width="10" height="9" hspace="0" vspace="0" border="0" style="float:right;margin-right:-5px; margin-top:-5px;"\>Nyhet 
                1\</strong\>\<br\>
                Lor illum qui tions enim ipsustio od del diam aci blam ing et 
                ulputate voloboreet dolorper sustincil et vulluptat lut nos euisl 
                utpat nonsenim vero del exerci etue minim duisit luptat. Dolore 
                modolore min ut dolenibh et ercilis exeraessi.\</div\>\</td\>
          \</tr\>
          \<tr\> 
            \<td align="center" style="width:100%; height:2px; background-color='#E3EAF4'"\>\</td\>
          \</tr\>
          \<tr onMouseOver="this.style.backgroundColor='#E3EAF4'" onMouseOut="this.style.backgroundColor='white'"\> 
            \<td valign="top"\> \<strong\>2005-09-10\</strong\> &nbsp; &nbsp; \<a href="#" onClick="toggle(nyhet2);goSetHeight()"\>Nya 
              pass till h&ouml;sten\</a\> 
              \<div id="nyhet2" class="news" onClick="toggle(nyhet2)" title="Klicka för att stänga nyheten!"\> 
                \<strong\>\<img src="images_tour/form/form_news_close.gif" width="10" height="9" hspace="0" vspace="0" border="0" style="float:right;margin-right:-5px; margin-top:-5px;"\>Nyhet 
                2\</strong\>\<br\>
                Quat prat, susci tis aliquis nis dolore velit, sustrud dolor sit 
                wisi ercillan et nulluptatio dolore cor sim diam ing exer accum 
                adion veliqui bla feum duissectet volut am ing eugue tate tat 
                lore cor adigna facil dolenit, conse elenim er augue do dolenisim 
                vel dunt lum zzrilla am, quat.\<br\>
              \</div\>\</td\>
          \</tr\>
        \</table\>
      \</div\>\</td\>
  \</tr\>
  \<tr\> 
    \<td\>&nbsp;\</td\>
  \</tr\>
\</table\>
\</body\>
\</html\>

Permalänk: https://www.webforum.nu/p/134329

## #2 — Peter S, 2005-09-15T09:25Z

1\. Använd kod-/php-taggarna (&#91;kod\]kod här&#91;/kod\]) när du postar kod.
2\. Var är PHP-koden du vill använda dig av?
3\. Var i JavaScript-koden skall PHP-koden vara?

Permalänk: https://www.webforum.nu/p/1672030

## #3 — kicki_an, 2005-09-15T12:50Z

OK, det gick lite snabbt när jag klistrade in koden... ledsen för det.
I funktionen setDisplay() nedan skulle jag ju vilja sätta alla beroende på hur många nyheter det är tex. Nyheterna ligger i en databas och antalet kan jag ju genom php utläsa. Men hur får jag in det i javaScriptet? Är inte så haj på javascript som du märker...

```
<html>
<head>
<link href="content/inc/global.css" rel="stylesheet" type="text/css">
<script>
function toggle(e) 
{ // kollar om lagret är på eller av
   if (e.style.display == "none") 
   {
      e.style.display = "block";
   } 
   else 
   {
       e.style.display = "none";
   }
}

function setDisplay() //sätter none på alla så man slipper kolla fler gånger ovan
{
   nyhet1.style.display="none";
   nyhet2.style.display="none";
}

</script>

<script src="content/inc/setheight.js" language="javascript" type="text/javascript"></script>
</head>
<body onLoad="goSetHeight();setDisplay()">
<table width="514" border="0" align="center" cellpadding="0" cellspacing="0">
<tr> 
<td align="right"><A href="javascript:window.print();"><img src="images_tour/button_skrivut.gif" width="51" height="17" hspace="0" vspace="0" border="0"></a>&nbsp;<a href="javascript:window.history.go(-1);"><img src="images_tour/button_back.gif" alt="Tillbaka" width="69" height="17" hspace="0" vspace="0" border="0"></a></td>
</tr>
<tr> 
<td valign="top">&nbsp;</td>
</tr>
<tr> 
<td valign="top"> 
<!--Content, start-->
<div class="divborder"> 
<table width="100%" border="0" cellpadding="4" cellspacing="1" bordercolor="#EFEFEF">
<tr class="bluetop"> 
<td bgcolor="#EFEFEF"><strong>Nyheter 2005</strong></td>
</tr>
<tr> 
<td align="center" style="width:100%; height:2px; background-color='#E3EAF4'"></td>
</tr>
<tr><!--background-image: url(../../images_tour/form/form_newsheadbg.gif)--> 
<td valign="top" onMouseOver="this.style.backgroundColor='#E3EAF4'" onMouseOut="this.style.backgroundColor='white'"> 
<strong>2005-09-13</strong> &nbsp; &nbsp; <a href="#" onClick="toggle(nyhet1);goSetHeight();">Nya 
avgifter p&aring; trafik</a>
<div id="nyhet1" class="news" onClick="nyhet1.style.display='none'" title="Klicka för att stänga nyheten!"> 
<strong><img src="images_tour/form/form_news_close.gif" width="10" height="9" hspace="0" vspace="0" border="0" style="float:right;margin-right:-5px; margin-top:-5px;">Nyhet 
1</strong><br>
Lor illum qui tions enim ipsustio od del diam aci blam ing et 
ulputate voloboreet dolorper sustincil et vulluptat lut nos euisl 
utpat nonsenim vero del exerci etue minim duisit luptat. Dolore 
modolore min ut dolenibh et ercilis exeraessi.</div></td>
</tr>
<tr> 
<td align="center" style="width:100%; height:2px; background-color='#E3EAF4'"></td>
</tr>
<tr onMouseOver="this.style.backgroundColor='#E3EAF4'" onMouseOut="this.style.backgroundColor='white'"> 
<td valign="top"> <strong>2005-09-10</strong> &nbsp; &nbsp; <a href="#" onClick="toggle(nyhet2);goSetHeight()">Nya 
pass till h&ouml;sten</a> 
<div id="nyhet2" class="news" onClick="toggle(nyhet2)" title="Klicka för att stänga nyheten!"> 
<strong><img src="images_tour/form/form_news_close.gif" width="10" height="9" hspace="0" vspace="0" border="0" style="float:right;margin-right:-5px; margin-top:-5px;">Nyhet 
2</strong><br>
Quat prat, susci tis aliquis nis dolore velit, sustrud dolor sit 
wisi ercillan et nulluptatio dolore cor sim diam ing exer accum 
adion veliqui bla feum duissectet volut am ing eugue tate tat 
lore cor adigna facil dolenit, conse elenim er augue do dolenisim 
vel dunt lum zzrilla am, quat.<br>
</div></td>
</tr>
</table>
</div></td>
</tr>
<tr> 
<td>&nbsp;</td>
</tr>
</table>
</body>
</html>
```

Permalänk: https://www.webforum.nu/p/1672085

## #4 — Peter S, 2005-09-15T14:02Z

Om vi antager att antalet nyheter läses in i variabeln $antal, då

```php
<script type="text/javascript">

function setDisplay()
{
<?
$antal = 10;

for ($i = 0; $i < $antal; ++$i){
    echo " nyhet" . $i . ".style.display = ";
    if (($i + 1) % $antal != 0){
		echo "\n\t";
    } else {
		echo "\"none\"";
    }
}
?>

}
</script>
```

Permalänk: https://www.webforum.nu/p/1672107

## #5 — kicki_an, 2005-09-15T14:39Z

Hejsan!

Lysande, precis vad jag var ute efter, men tyvärr resulterar mina försök att använda det i att det blir "fel på sidan".

Kan du se vad felet är i min kod...?

```php
function setDisplay()  //sätter none på alla så man slipper kolla fler gånger ovan
{
	<? 
	$check_news = mysql_query("SELECT * FROM news WHERE status='1'") or die ("Error: " . mysql_error());
	$antal=mysql_num_rows($check_news);

	for ($i = 0; $i < $antal; ++$i)
	{ 
		echo " nyhet" . $i . ".style.display = "; 
		if (($i + 1) % $antal != 0)
		{ 
			echo "\n\t"; 
		} else 
		{ 
			echo "\"none\""; 
		} 
	} 
?>
}
```

Permalänk: https://www.webforum.nu/p/1672119

## #6 — Peter S, 2005-09-15T14:45Z

Möjligtvis att det inte finns någon nyhet0. Då

```php
<script type="text/javascript">

function setDisplay()
{
<?
$check_news = mysql_query("SELECT * FROM news WHERE status='1'") or die ("Error: " . mysql_error());
$antal=mysql_num_rows($check_news); 

for ($i = 1; $i <= $antal; ++$i){
    echo " nyhet" . $i . ".style.display = ";
    if ($i % $antal != 0){
		echo "\n\t";
    } else {
		echo "\"none\"";
    }
}
?>

}
</script>
```

Permalänk: https://www.webforum.nu/p/1672122

## #7 — kicki_an, 2005-09-15T15:07Z

Du är ju lysande!
Allt fungerar enormt bra nu tack vare dig!!!

Permalänk: https://www.webforum.nu/p/1672130

---

Tråden på webben: https://www.webforum.nu/amne/php/134329-knyta-samman-php-och-javascript
