current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I have some images and what i want to do is on mouse over each pic to change a text inside a div which is the image title.

So here's my code:

<?php
...

$i=0;
while($i<$imageno)
{

echo'
<script type="text/javascript">
function changeText() {document.getElementById("title").innerHTML = "'.$title[$i].'";}
</script>';

if ($imagine[$i]){
echo '<div onmouseover="changeText()"><img src="'.$imagine[$i].'"></div>';
};
$i++;
}

...
?>

But my script shows only the tscription of my last picture...

Please help! ...without Ajax

share|improve this question
    
Asided from the function definition issue outlined in the answers below, you are using getElementById() in every iteration which means the same element will be affected every time. You cannot have more than one element with the same ID, they must be unique. You will need to show more code (namely the part where you define the element with id="title" before we can tell you the correct solution. –  DaveRandom Jun 21 '12 at 11:09

2 Answers 2

up vote 1 down vote

You don't need to put the function definition in the loop, and you need to use parameter.

<script type="text/javascript">
function changeText(title) {document.getElementById("title").innerHTML = title;}
</script>

<?php
//... 
$i=0;
while($i<$imageno) {
  if ($imagine[$i]){
    $title = json_encode(htmlspecialchars($title[$i]));
    echo '<div onmouseover="changeText('.$title.')"><img src="'.$imagine[$i].'"></div>';
  };
  $i++;
}
//...
?>
share|improve this answer
    
Check your quotes (there are not enough of them) –  DaveRandom Jun 21 '12 at 11:06
    
@DaveRandom Yep, thx for point it out. –  xdazz Jun 21 '12 at 11:08
    
I have just realised this still wont work because of the static getElementById() - it will affect the same element on every iteration so you still won't see an effect for anything other than the last $title[$i]. The OP needs to provide more code. Also you should escape literal ' characters in $title[$i] as well as the htmlspecialchars() –  DaveRandom Jun 21 '12 at 11:11
    
@DaveRandom Yep, assume he has only one title div. And you should use htmlspecialchars to escape ', use str_replace to "\\'" won't help because ' need to be &#039;. –  xdazz Jun 21 '12 at 11:16
1  
@DaveRandom And that's why I don't like to use php and javascript like this. –  xdazz Jun 21 '12 at 11:33
up vote 3 down vote

You need to pass variable to changeText function:

echo '<div onmouseover="changeText('".$title[$i]."')"><img src="'.$imagine[$i].'"></div>';

And to change changeText function like this:

function changeText( myText ) {document.getElementById("title").innerHTML = myText;}
share|improve this answer
    
echo '<div onmouseover="changeText(\''.str_replace("'", "\\'", htmlspecialchars($title[$i])).'\')"><img src="'.$imagine[$i].'"></div>'; –  DaveRandom Jun 21 '12 at 11:01

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.