InnerHTML e php!

[andbaz]

Questo è il mio script, un codice che mi permette di visualizzare un tooltip al passaggio sopra del mouse su di un determinato elemento, volevo sapere come immettere del codice php all'interno dell'innerHTML verso metà script, esiste un sistema x risolvere il mio problema? Se si in che modo risolvo?

var tip = new (function() {
    var overX, overY, leftPos, topPos, div, OFF = true;    
    this.follow = function (mouse1) {    
        if (OFF) { return; }        
        if (!mouse1) { mouse1 = window.event; }        
        var moveX =  mouse1.clientX, moveY =  mouse1.clientY;        
        leftPos += moveX - overX; topPos += moveY - overY;
        div.style.left = leftPos + "px";
        div.style.top = topPos + "px";        
        overX = moveX; overY = moveY;
    };    
    this.remove = function () {
        if (OFF) { return; }
        OFF = true; document.body.removeChild(div);
    };
    this.append = function (mouse2) {
        if (!mouse2) { mouse2 = window.event; }
        [COLOR=red]div.innerHTML = "<div><?php echo $piu; ?></div>";[/COLOR] 
        if (OFF) { document.body.appendChild(div); OFF = false; }
        var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft, scrollY = document.documentElement.scrollTop || document.body.scrollTop, nWidth = div.offsetWidth, nHeight = div.offsetHeight;
        overX = mouse2.clientX; overY = mouse2.clientY;
        leftPos = document.body.offsetWidth - overX - scrollX > nWidth ? overX + scrollX + 10 : document.body.offsetWidth - nWidth + 16;
        topPos = overY - nHeight > 6 ? overY + scrollY - nHeight - 7 : overY + scrollY + 20;
        div.style.left = leftPos + "px";
        div.style.top = topPos + "px";        
    };
    this.init = function() {
        div = document.createElement('div');
        div.setAttribute('id','tip');
    };
})();

[codencode]

Ciao,
se questo script è salvato in un file .js, non puoi farlo perchè javascript viene eseguito lato client, mentre php lato server.

Quindi puoi fare in 3 modi:
1) rinomi il file javascript da .js a .php aggiornando ovviamente il source all'interno dell'html;
2) imposti una variabile nell'html mediante javascript e poi la richiami nello script es:

<script type="text/javascript">var variabile=<?php echo $piu; ?></script>

e nello script fai:

 div.innerHTML = "<div>"+variabile+"</div>";

3) utilizzi ajax per far comunicare javascript e php.

[andbaz]

Sto seguendo il secondo metodo, mi sembra il più semplice da seguire per uno alle prime armi in javascript come me. Direi che ci siamo, però non funziona del tutto, all'evento onmouseover si viene eseguito l'effetto del div che segue il mouse, però invece della scritta 'test' mi viene scritto 'undefined'. Penso che si tratti della variabile, ti incollo tutto sugli script.
Come risolvo? Dove sta l'errore?
PS: non credo di avere capito il primo metodo!

var tip = new (function() {
	var overX, overY, leftPos, topPos, div, OFF = true, php;
	this.follow = function (mouse1) {	
		if (OFF) { return; }		
		if (!mouse1) { mouse1 = window.event; }		
		var moveX =  mouse1.clientX, moveY =  mouse1.clientY;		
		leftPos += moveX - overX; topPos += moveY - overY;
		div.style.left = leftPos + 'px';
		div.style.top = topPos + 'px';		
		overX = moveX; overY = moveY;
	};	
	this.remove = function () {
		if (OFF) { return; }
		OFF = true; document.body.removeChild(div);
	};
	this.append = function (mouse2, php) {
		if (!mouse2) { mouse2 = window.event; }
		div.innerHTML = php;
		if (OFF) { document.body.appendChild(div); OFF = false; }
		var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft, scrollY = document.documentElement.scrollTop || document.body.scrollTop, nWidth = div.offsetWidth, nHeight = div.offsetHeight;
		overX = mouse2.clientX; overY = mouse2.clientY;
		leftPos = document.body.offsetWidth - overX - scrollX > nWidth ? overX + scrollX + 10 : document.body.offsetWidth - nWidth + 16;
		topPos = overY - nHeight > 6 ? overY + scrollY - nHeight - 7 : overY + scrollY + 20;
		div.style.left = leftPos + 'px';
		div.style.top = topPos + 'px';		
	};
	this.init = function() {
		div = document.createElement('div');
		div.setAttribute('id','tip');
		div.style.position = 'absolute';
	};
})();

...
<script type="text/javascript">var php=<?php echo 'test'; ?></script>
...
home.php
#tip {
position: absolute;
width: auto;
height: auto;
top: -20;
left: 300;
padding: 0 2 0 2;
color: #ffffff;
background: #000000;
border: 0 solid #f8f8f8;
font-family: centaur;
font-size: 16;
float: right;
z-index: 999;
}

<body id='body' onload="tip.init()">
...
<input type='submit' onmouseover="tip.append(event, php)" onmouseout="tip.remove();" onmousemove="tip.follow(event);">
...

[codencode]

Hai mancato le virgolette, anche se le avevo mancato anche io nell'esempio, quindi sosittuisci:

var php=<?php echo 'test'; ?>

con

var php="<?php echo 'test'; ?>"

[andbaz]

Giusto
Ho una domanda, io nella variabile php però vorrei farci eseguire una funzione che questa poi restituisca un valore, cioè il valore da sostituire alla parola test che ho usato prima x provare tutto il sistema, il proble è che se inserisco var php="<?php piu(); ?>" tutta la pagina risulta essere bianca. Allora ho provato così, come prima x provare ho creato una funzione molto semplice, ma ancora niente, il tooltip non risulta più funzionare.
Come risolvo?

<script type="text/javascript"> 
         var php = "<?php $funpiu; ?>" 
</script>

function piu() {
$casa = 'casa';
return $casa;
}

$funpiu = piu();

[Friko85]

perchè non ti recuperi i valori con ajax

fai uan pagin a php dove a seconda della variabile get ti stampa la variabile

pagina.php?var= a/b/c/d

cosi la pagina dello script non deve essere php

[andbaz]

Il problema è che di ajax non so niente (x ora, ovviamente). Penso che ajax in questo caso non sia necessario. Credo che ormai siamo vicini alla soluzione, però c'è qualcosa che mi sfugge evidentemente, e non capisco cosa. Riquoto quello che ho scritto nel messaggio prima: come risolvo?

[Friko85]

var php="<?php echo piu(); ?>";

[andbaz]

no, niente, ancora pagina completamente bianca. Ho provato a mettere tutto su di una riga, niente, pagina bianca.

<script type="text/javascript"> 
            var php = "<?php $sql = "SELECT * FROM post WHERE IDP='$idsp' ORDER BY IDP DESC"; $query = mysql_query($sql) or die (mysql_error()); while ($row = mysql_fetch_assoc($query)) { $piu = $row['PIU']; } echo $piu; ?>"
        </script>

Se invece facessi così tutto funziona, solo che mi viene stampata la parola 'test' che è di prova, tanto per vedere se il sistema funziona oppure no...
Perchè tutto questo?

<script type="text/javascript"> 
        var php = "<?php $piu = 'test'; echo $piu; ?>"
</script>

[Friko85]

si vede che + non restituisce nulla e js non centra.. ciao