Cómo acceder a las variables de PHP en JavaScript o jQuery en lugar de <? Php echo $ variable?>

Question

¿Cómo accedo a las variables de PHP en JavaScript o jQuery? ¿Tengo que escribir

<?php echo $variable1 ?> 
<?php echo $variable2 ?> 
<?php echo $variable3 ?> 
... 
<?php echo $variablen ?> 

Sé que puedo almacenar algunas variables en las cookies, y acceder a estos valores a través de las cookies, pero los valores de las cookies son valores relativamente estables. Además, hay un límite, no puede almacenar muchos valores en las cookies, y el método no es tan conveniente. Hay una mejor manera de hacerlo?

Answer 1

Su ejemplo muestra la forma más sencilla de pasar variables PHP a JavaScript. También puede utilizar json_encode para cosas más complejas como matrices:

<?php 
    $simple = 'simple string'; 
    $complex = array('more', 'complex', 'object', array('foo', 'bar')); 
?> 
<script type="text/javascript"> 
    var simple = '<?php echo $simple; ?>'; 
    var complex = <?php echo json_encode($complex); ?>; 
</script> 

Aparte de eso, si realmente quiere "interactuar" entre PHP y JavaScript que puedes usar Ajax.

Usar cookies para esto es una forma muy insegura y poco confiable, ya que se almacenan en el lado del cliente y por lo tanto están abiertas para cualquier manipulación o incluso no serán aceptadas/guardadas. No los uses para este tipo de interacción. jQuery.ajax es un buen comienzo en mi humilde opinión.

Answer 2

Básicamente, sí. Usted escribe alert('<?php echo($phpvariable); ?>');

Existen otras formas de interoperar, pero ninguna de las cuales se me ocurre es tan simple (o mejor) como la anterior.

Answer 3

Yo diría que echo() ing directamente en el código fuente de Javascript es la manera más confiable y compatible. Quédese con eso a menos que tenga una buena razón para no hacerlo.

Answer 4

Estás haciendo una especie de pregunta en dos partes. En cuanto a la sintaxis (Creo que desde PHP 4?) Que puede utilizar:

<?=$var?> 

... si PHP está configurado para permitirlo. Y está en la mayoría de los servidores.

Por lo que el almacenamiento de datos de usuario, también tienen la opción de almacenar en la sesión:

$_SESSION['bla'] = "so-and-so"; 

para la persistencia de una página a otra. También puedes usar una base de datos. Incluso puede tener PHP almacenar las variables de sesión en el db. Solo depende de lo que necesitas.

Answer 5

Si AJAX no es una opción, puede utilizar estructuras de datos anidados para simplificar.

<?php 
$var = array(
    'qwe' => 'asd', 
    'asd' => array(
     1 => 2, 
     3 => 4, 
    ), 
    'zxc' => 0, 
); 
?> 
<script>var data = <?php echo json_encode($var); ?>;</script> 

Answer 6

Me encontré con un problema similar al crear una paginación personalizada para un sitio en el que estoy trabajando.

La variable global que creé en functions.php se definió y se configuró en 0. Podría generar este valor en mi javascript sin problemas utilizando el método @Karsten descrito anteriormente. El problema fue con la actualización de la variable global que inicialmente configuré en 0 dentro del archivo PHP.

Aquí está mi solución (hacky que sé?!) Pero después de luchar durante una hora en un plazo breve las siguientes obras:

Dentro de archivo-episodios.php:

<script> 
    // We define the variable and update it in a php 
    // function defined in functions.php 
    var totalPageCount; 
</script> 

Dentro functions.php

<?php 
    $totalPageCount = WP_Query->max_num_pages; // In my testing scenario this number is 8. 
    echo '<script>totalPageCount = $totalPageCount;</script>'; 
?> 

que sea sencillo, que estaba dando salida a la variable deTotalPageCount en un $ ajax.success devolución de llamada a través de alerta.

$.ajax({ 
     url: ajaxurl, 
     type: 'POST', 
     data: {"action": "infinite_scroll", "page_no": pageNumber, "posts_per_page": numResults}, 
     beforeSend: function() { 
      $(".ajaxLoading").show(); 
     }, 
     success: function(data) { 
          //alert("DONE LOADING EPISODES"); 
      $(".ajaxLoading").hide(); 

      var $container = $("#episode-container"); 

      if(firstRun) { 
       $container.prepend(data); 
       initMasonry($container); 
       ieMasonryFix(); 
       initSearch(); 
      } else { 
       var $newItems = $(data); 
       $container.append($newItems).isotope('appended', $newItems); 
      } 
      firstRun = false; 

      addHoverState();        
      smartResize(); 

      alert(totalEpiPageCount); // THIS OUTPUTS THE CORRECT PAGE TOTAL 
     } 

Sea como sea, ¡espero que esto ayude a los demás! Si alguien tiene una versión "menos hacky" o un ejemplo de mejor práctica, soy todo oídos.