Как получить несколько файлов JSON для нескольких Div?

Question

Я хочу получить данные JSON из нескольких файлов. Я делаю плагин для этого. Здесь я могу поместить данные из одного файла JSON. Но когда я хотел извлечь данные из нескольких файлов json, все данные добавляются в один и тот же div. Что я могу сделать, чтобы получить данные отдельного файла на отдельном div? Мой код для вызова плагина:

$(document).ready(function(){
    //$("#slider").easySlider();
    $(".slider1").r3dImage({
            url: "ajax/test.txt",
            pause: 800
    });

    $(".slider2").r3dImage({
        url: "ajax/test2.txt",
        pause: 400
    });
});

Мой плагин для этого:

(function($){

    $.fn.r3dImage = function(options){
    var defaults = {
        url:    '',
        pause:  2000
    }; 

    var options = $.extend(defaults, options);
    //retrive json file
    //setInterval(function(){
        // get new json result from server by Ajax here

        obj = $(this);
        //var body = obj.html();

        $.ajax({
        type: "POST",
        url: options.url,
        dataType: "json",
        cache: false,
        contentType: "application/json",
        success: function(data) {
        //alert("Success");
        $.each(data.dashboard, function(i,post){
           html = '<li>';
           html += '<a href="'+post.TargetUrl+'" target="'+post.Target+'">';
           html += '<img src="' + post.ImageUrl + '" alt="' + post.Alt +'" title="' + post.OverlayText +'" />';
           html += '</a><p>'+post.OverlayText+'</p></li>';
        $("ul", obj).append(html);

        });
        $(obj).easySlider({
            auto: true, 
            continuous: true
        });
        },
        error: function(xhr, status, error) {
            alert(xhr.status);
        }
        });
    };

})(jQuery);

После того, как я загружу контент в отдельный div, я буду прокручивать данные, используя easyslider .
Формат файла json:

{
"dashboard": [
    {
        "ImageUrl": "images/03.jpg",
        "OverlayText": "demo image 3",
        "TargetUrl": "http://lkamal.com.np",
        "Target": "_blank",
        "Alt": "Image 3",
        "Timer ": 2000
    },
    {
        "ImageUrl": "images/04.jpg",
        "OverlayText": "demo image 4",
        "TargetUrl": "http://lkamal.com.np",
        "Target": "_blank",
        "Alt": "Image 4",
        "Timer ": 2000
    }
    ]
}

любая помощь?

Answer 1

Я сделал это с некоторой модификацией.

//retrive JSON feed from external file
            $.ajax({
               type: "POST",
               url: test.txt,
               dataType: "json",
               cache: false,
               contentType: "application/json; charset=utf-8",
               //beforeSend: function() { $("#slider ul").html("Saving").show(); }, 
               success: function(data) {
               //alert("Success");
               html = '';
                $.each(data.dashboard, function(key,items) {
                   html += '<li>';
                   html += '<a href="'+items.TargetUrl+'" target="'+items.Target+'">';
                   html += '<img src="' + items.ImageUrl + '" alt="' + items.Alt +'" title="' + items.OverlayText +'" />';
                   html += '</a><p>'+items.OverlayText+'</p></li>';                           
                });
                $("ul", element).empty();
                $("ul", element).append(html); //appending the json data with respective div
                //startSlides(element); //start slideshow


                //$(options.container).easySlider({
              },
                error: function(xhr, status, error) {
                    alert(xhr.status);
                }
            });

Но я застрял с другой проблемой этого плагина, которую я разместил Здесь .