Dinamik javascript bir php işlevi çağırmak için nasıl

6 Cevap php

Aşağıdaki js fonksiyonlu bir index.php vardır:

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?
}

Ancak, sayfa yüklendiğinde, php script denir ve sonuç böyle kaynak kodu eklendiğinde:

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?
 }

Ne olmasını istiyorum ben js fonksiyonunu (returnImageString) çağırdığınız, ben bunun yerine js işlevi kodlanmış dize sahip php fonksiyonunu (php fonksiyonu rastgele görüntü yerle bir dize döndürür beri) her zaman aramak istiyorum.

Birisi bana doğru yönde işaret edebilir? Teşekkürler!

6 Cevap

Eğer sunucu tarafı davranışları ile istemci tarafı davranışını karıştırma çünkü bu mümkün değildir. Yapmanız gereken sunucuya bir AJAX isteği oluşturmaktır.

Eğer jQuery (ki bu AJAX bir esinti yapar çünkü gerçekten istiyorum) gibi bir kütüphaneyi kullanarak olsaydı böyle bir şey yapardı:

PHP Code (maybe 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;

Client Side 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
        });
    });
}

Görüntülerin miktarı sonlu ise Alternatif olarak, tüm bu crazyness atlayabilir ve sadece tüm görüntüleri ile bir dizi var ve Javascript kendisinden 8 rasgele yenilerini oluşturmak. Bu muhtemelen daha küçük veri setleri ve hatta bazı büyük olanlar için daha iyi olurdu.

PHP sunucuda yorumlanır ve istemci üzerinde JavaScript kullanarak konum çünkü doğrudan yapmak mümkün etmeyeceğiz. Ancak, sunucu üzerinde bir sayfa rastgele image.php oluşturmak eğer AJAX kullanarak veri almak olabilir ve o döndüğünde, sunucu tarafı işlemek.

İki seçeneğiniz var:

  1. Ajax kullanmak
  2. Script etiketleri içinde (mümkünse görüntü değerler) bir JavaScript dizi yankı ve daha sonra aradığımda rasgele bunlardan birini seçmek için bir JavaScript işlevi oluşturmak için PHP kullanabilirsiniz.

İkinci seçenek, benim görüşüme göre, iyi görünüyor.

I made this a while back... maybe it can help you. It's an example of calling a php function inside javascript with ajax. (I used gzcompress) the php file has to be named foo.php to work with this demo.

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']);

?>

Eğer Javascript adresinden PHP fonksiyonları kullanmak için mwsX kütüphane kullanabilirsiniz.

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

Bu yaygın Ajax olarak bilinir. Bunun için google.

etiketler