JQuery обновить другое изображение - PullRequest
Новая
       0

JQuery обновить другое изображение

0 голосов
/ 08 декабря 2011

Я знаю, что в PHP вы можете иметь несколько разных изображений, которые, когда вы покидаете страницу и возвращаетесь или обновляете ее, вы получаете другое изображение. Возможно ли сделать это в jQuery?

Извините, у меня нет тестового кода, я просто не знаю, с чего начать

Ответы [ 3 ]

1 голос
/ 08 декабря 2011

Вы можете сделать что-то простое, как это 

var random = Math.floor(Math.random()*3);

if(random == 0){
    $('#one').show();
}

if(random == 1){
    $('#two').show();
}

if(random == 2){
    $('#three').show();
}

Пример : http://jsfiddle.net/LBDAw/

(Нажмите RUN снова и снова, чтобы увидеть изменение, которое являетсятак же, как перезагрузка страницы, так как это будет называться onLoad)

1 голос
/ 08 декабря 2011

Если вы хотите использовать метод cookie, чтобы убедиться, что пользователь никогда не получит одно и то же дважды, я бы вставил всю вашу информацию в json, который вы можете получить из запроса ajax, если это необходимо.

Но это может быть излишним для того, что вам нужно!

Пример 

    <html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
        <script type="text/javascript">

//JSON with your image data

            var imageJson = {"images": [
        {"imgSrc": "image1.jpg", "imgAlt": "Image one"},
        {"imgSrc": "image2.jpg", "imgAlt": "Image two"},
        {"imgSrc": "image3.jpg", "imgAlt": "Image three"}
                ]
            };

//Wait for dom to load then do our stuff

            $(document).ready(function() {
                moveCookie();
            });

//Name off your cookie      
            var cookieName = "counteuoi1dff";
//Id off your image tag
            var imgId = "img1";

        function moveCookie(){
            if(getCookie(cookieName) != undefined){
                var lastImage = parseInt(getCookie(cookieName));

            if(lastImage > imageJson.images.length-1){
                setCookie(cookieName,0,365);
                lastImage = 0;              
            }
                $("#"+imgId).attr("src",imageJson.images[lastImage].imgSrc);
                $("#"+imgId).attr("alt",imageJson.images[lastImage].imgAlt);

                setCookie(cookieName,lastImage+1,365);              
            }else{
                setCookie(cookieName,1,365);
                lastImage = 1;
            }
        }

//Default cookie functions for javascript dont worry about these

            function setCookie(c_name,value,exdays)
                {
                    var exdate=new Date();
                    exdate.setDate(exdate.getDate() + exdays);
                    var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
                    document.cookie=c_name + "=" + c_value;
                }
            function getCookie(c_name)
                {
                    var i,x,y,ARRcookies=document.cookie.split(";");
                        for (i=0;i<ARRcookies.length;i++)
                            {
                                x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
                                y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
                                x=x.replace(/^\s+|\s+$/g,"");
                                if (x==c_name)
                                    {
                                        return unescape(y);
                                    }
                            }
                    }   

        </script>
    </head>
    <body>
        <img src="image1.jpg" alt="Image one" id="img1"/>
    </body>

</html>

Пример с его запуска: здесь просто продолжайте обновлять

1 голос
/ 08 декабря 2011

Да, это возможно.

Если вы хотите сделать все на стороне клиента, я думаю, у вас есть два варианта. Один из них заключается в случайном отображении другого изображения каждый раз.

Во-вторых, необходимо сохранить файл cookie и отобразить изображение на основе значения файла cookie.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...