tablas - llamar funcion php desde javascript

Cómo llamar dinámicamente una función php en javascript

Question

Tengo un index.php con la siguiente función js:

function returnImageString() {
    return "<?php include ''inc/image.functions.php''; echo getRandomImages(7); ?>";        //This isn''t dynamic; this will always return the same images.  How do I fix this?
}

Sin embargo, cuando se carga la página, se llama al script php y el resultado se agrega al código fuente de esta manera:

function returnImageString() {
    return "images/20.11.A1B9.jpg|images/8.14.47683.jpg|images/19.10.FBB9.jpg|images/21.12.9A.jpg|images/8.11.1474937909.jpg|images/8.15.99404.jpg|images/8.10.jpg|"; //This isn''t dynamic; this will always return the same images. How do I fix this?
 }

Lo que quiero que ocurra es siempre que llamo a la función js (returnImageString), quiero que llame a la función php cada vez (ya que la función php devuelve una cadena de ubicaciones de imágenes aleatorias) en lugar de tener la cadena codificada en la función js.

¿Alguien me puede apuntar en la dirección correcta? ¡Gracias!

Answer 1

Eso es comúnmente conocido como Ajax. Google por eso.

Answer 2

Esto no es posible porque está mezclando el comportamiento del lado del cliente con el comportamiento del lado del servidor. Lo que debe hacer es crear una solicitud AJAX para el servidor.

Si estuvieras usando una biblioteca como jQuery (que realmente quieres, porque hace que AJAX sea muy sencillo) harías algo como esto:

Código PHP (¿tal vez randomImages.php?)

// query for all images
// $_GET[''limit''] will have the limit of images
// since we passed it from the Javascript
// put them all in an array like this:
$images = array(''images/20.11.A1B9.jpg'',''images/20.11.A1B9.jpg'',...);
print json_encode($images); // return them to the client in JSON format.
exit;

Lado del cliente Javascript

function getRandomImages(limit) {
    // make request to the server
    $.getJSON(''/path/to/randomImages.php'', {limit: limit}, function(data) {
        // data is now an array with all the images
        $.each(data, function(i) {
            // do something with each image
            // data[i] will have the image path
        });
    });
}

Alternativamente, si la cantidad de imágenes es finita, puede omitir toda esta locura y simplemente tener una matriz con todas las imágenes y generar 8 aleatorias del Javascript mismo. Esto probablemente sería mejor para conjuntos de datos más pequeños e incluso algunos más grandes.

Answer 3

No vas a poder hacer esto directamente porque PHP se interpreta en el servidor y estás usando JavaScript en el cliente. Sin embargo, si creas una página random-image.php en tu servidor, puedes buscar los datos usando AJAX y manipularlos en el servidor cuando vuelva.

Answer 4

Tienes dos opciones:

1. Usa AJAX
2. Use PHP para hacer eco de una matriz de JavaScript (de posibles valores de imagen) dentro de las etiquetas de script y luego cree una función de JavaScript para elegir aleatoriamente una de ellas cuando se le llame.

La segunda opción parece ser la mejor, en mi opinión.

Answer 5

Hice esto hace un tiempo ... tal vez pueda ayudarte. Es un ejemplo de llamar a una función php dentro de javascript con ajax. (Utilicé gzcompress) el archivo php debe llamarse foo.php para que funcione con esta demostración.

javascript:

//lib
(function(a){for(var b in a)(function(c){a[b]=function(){c.apply(this,arguments);return this}})(a[b])})(XMLHttpRequest.prototype);

XMLHttpRequest.prototype.$p=function(a,b){for(b in a)this[b]=a[b];return this};

(function(a,d,i){for(i in d=document.getElementsByTagName(''*''))a[d[i].id]=d[i]})(document);
//lib

function gzcompress(s,c){

    var buffer;

    (new XMLHttpRequest)

    .$p({onreadystatechange:function(){if(this.readyState>3){

        buffer = this.responseText;

    }}})

    .open("POST","foo.php",!1)
    .setRequestHeader("Content-type","application/x-www-form-urlencoded")
    .send(
        "s="+s
        +"&"+
        "c="+c
    );
    return buffer;
}

//look! it''s gzcompress inside javascript! it''s magical!
document.myDiv.innerHTML = gzcompress("aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",2)

php:

<?php 

echo gzcompress($_POST[''s''], $_POST[''c'']);

?>

Answer 6

puede usar mi biblioteca mwsX para usar sus funciones PHP en Javascript.

Biblioteca mwsX: https://github.com/loureirorg/mwsx