Jquery inside foreach loop

I have this jquery code in a foreach loop. Basicaly the variable $perf gets a new value with every loop. How can I use jquery to display the different $perf value with each loop? Is it possible?

    foreach ($perfs as $perf):

    <script type="text/javascript">

    $(document).ready(function(){

    var performerName = $(".transparenc开发者_JS百科y").data('title'); 

    var divcontent = $(".transparency").html();

    if ( divcontent == '&nbsp;' ){

    $(".transparency").html(''+performerName+''); 

    }

    });

    </script>

   <div class="transparency" data-title="<? echo $perf; ?>">&nbsp;</div>

   endforeach;

You should do it like this:

<?
foreach ($perfs as $perf):
?>
    <script type="text/javascript">
    $(document).ready(function(){
       var $perf = "<? echo $perf; ?>"; //Get from php
       alert($perf); //Show it
       //Here goes the rest of your script
       var performerName = $(".transparency").data('title'); 
       var divcontent = $(".transparency").html();
       if ( divcontent == '&nbsp;' ){
         $(".transparency").html(performerName); 
       }
    });
    </script>

   <div class="transparency" data-title="<? echo $perf; ?>">&nbsp;</div>
<?
   endforeach;
?>

That's it. It works.

(I tried to modify your code at least as possible, cause I don't know if I can remove parts)

PS: There would be more 'elegant' solutions, do you want one? or this is enough?

Can you please describe what you are trying to do? I'm about 90% sure there is zero reason for any javascript, jQuery or otherwise.

Why not just do this?

<?php
foreach($perfs as $perf)
{
    echo "<div class='transparency' data-title='$perf'>$perf</div>";
}
?>

Unless there is something more you are trying to do, you don't need javascript at all. And even if you do need javascript, take the function out of the loop and call it once each iteration. you dont need the exact same function defined multiple times.

I suggest you look into the relationship between server and client-side scripting. For starters - take a look at the HTML source generated by your PHP and see if thats anything close to what you want. Also, read up about ajax. It seems that you are trying to do combine PHP/javascript in such a way that it needs additional HTTP Requests (ajax calls)

It is impossible to have PHP and javascript interact directly without AJAX, and it is difficult to answer the question without more knowledge of what, exactly, you want to happen.

If you want a different transparacy div for each value of $perfs you can use:

<?php foreach ($perfs as $perf) { ?>
   <div class="transparency" data-title="<?php echo $perf; ?>">&nbsp;</div>
<?php } ?>

And they you can use the jquery .each() to iterate over the divs

 $(".transparency").each( function() {
    var performerName = $(this).data('title');
    // do stuff //
 });

If all you want is to pass the values in $perfs to you javascript function you can use

  var perfs = <?php echo json_encode($perfs); ?>;

OK I think I see what you are trying to do now. You'll want something like this:

<script type="text/javascript">

$(document).ready(function(){

     var perfs = <?php echo json_encode($perfs); ?>;

     $.each( perfs, function( index, value ) {

         $( ".transparency" ).append( value+'<br>' );

     } );

} );

</script>

<div class="transparency"></div>

This will output each value of $perfs inside of the transparency div.

Using JQuery each and append.

You will never want to wrap an entire script in a foreach loop, as that will create a separate script for each element in the array. Using json_encode you will change the PHP array into a javascript object & you can do whatever you want to with it.

Remember javascript is only able to access elements written to the page using echo or something similar. Whatever you can see when you look at 'view page source' in your browser is all your script will be able to use.