CODEWITHSUNDEEP
phpjavascriptjqueryimage
John the Painter
John the Painter

Reputation: 2615

Insert string after images on a page

I have a bit of a dilemma where I'm trying to add 'figures' (numbers) to the end of each tag on a page. With each image on the page, a new number is added which is 1 greater than the last.

So far, I've come up with a combination of PHP and JS, but JS manages to insert the number, and PHP manages to increment the number, but neither are working together.

So far I have this:

<script>
$('img').after('<?php $c = 0; ?><p class="figure"><?php echo ++$c ?></p>');
</script>

But, PHP being server-side, it doesn't seem to increment the numbers, for all images on the page the number is always 1.

If I use this without the JS, and just put 

<?php $c = 0; ?>

at the top of the page, and then 

<p class="figure"><?php echo ++$c ?></p>

Hard-coded for each image, it works fine, but I need a way for it to add it all in automatically after each tag, and not always be hard-coded in.

Any thoughts?

Upvotes: 2

Views: 187

Answers (1)

Michael Berkowski
Michael Berkowski

Reputation: 270767

You don't need PHP here. You can do it all with jQuery:

<script type='text/javascript'>
  var c = 0;
  $("img").each(function() {
    $(this).after("<p class='figure'>" + ++c + "</p>");
  });
</script>

Here's the jsfiddle

Upvotes: 5

Related Questions