1

無名関数と Slider() 関数を使用しています。1 つの関数だけですべて同じ機能が必要です。私が使用している無名関数は削除する必要があります。以下のコードは 1 つの関数に入る必要があります。

これは私が試したものです：

http://jsfiddle.net/QNZDX/5/

$(function() {
        //FadeIn/FadeOut Image on Set Time Interval on Slide
        timer=setInterval(Slider, mainInterval);
        var div=$('<div id="paging_inner"></div>');
        for(i=0;i<maximages;i++)
        {
            div.append($('<a id="page_'+(i+1)+'" data-index="'+(i+1)+'"><span></span></a>'));
        }
        $('#paging').append(div);

        $('#paging a').on('click', function(e){
          e.preventDefault();
          clearInterval(timer);
          prevIndex=$(this).attr('data-index')-1;
          $('#paging div a span').stop(1,1);
          Slider();
          timer=setInterval(Slider, mainInterval);
        });

    });

    function Slider() {
        $('#imageSlide').fadeOut("slow", function() {
            if (prevIndex >= maximages) prevIndex = 0;

            $("#panel").fadeIn("slow").css('background', '#000');

            var title = $xmldata.find("images").find("image:eq(" + prevIndex + ")").find("title").text();
            $("#title").text(title).fadeIn("slow");

            var imgurl = $xmldata.find("images").find("image:eq(" + prevIndex + ")").find("url").text();
            $(this).attr('src', imgurl).fadeIn("slow");

            var desc = $xmldata.find("images").find("image:eq(" + prevIndex + ")").find("desc").text();
            $("#desc").text(desc).fadeIn("slow");
            $('#paging a span')
            .removeClass('active').css('display','block');
            $('#paging a#page_'+(prevIndex+1)+' span')
            .addClass('active')
            .slideUp(mainInterval);
            prevIndex++;

        });
    }

});
4

1 に答える 1

0

初めに、

それは匿名関数以上のものです-それは自己呼び出し匿名関数です

しかし、この場合、それはまったく必要ありません、

これは以前と同じように機能します

//FadeIn/FadeOut Image on Set Time Interval on Slide
timer = setInterval(Slider, mainInterval);
var div = $('<div id="paging_inner"></div>');
for (i = 0; i < maximages; i++) {
    div.append($('<a id="page_' + (i + 1) + '" data-index="' + (i + 1) + '"><span></span></a>'));
}
$('#paging').append(div);

$('#paging a').on('click', function(e) {
    e.preventDefault();
    clearInterval(timer);
    prevIndex = $(this).attr('data-index') - 1;
    $('#paging div a span').stop(1, 1);
    Slider();
    timer = setInterval(Slider, mainInterval);
});

function Slider() {
    $('#imageSlide').fadeOut("slow", function() {
        if (prevIndex >= maximages) prevIndex = 0;

        $("#panel").fadeIn("slow").css('background', '#000');

        var title = $xmldata.find("images").find("image:eq(" + prevIndex + ")").find("title").text();
        $("#title").text(title).fadeIn("slow");

        var imgurl = $xmldata.find("images").find("image:eq(" + prevIndex + ")").find("url").text();
        $(this).attr('src', imgurl).fadeIn("slow");

        var desc = $xmldata.find("images").find("image:eq(" + prevIndex + ")").find("desc").text();
        $("#desc").text(desc).fadeIn("slow");
        $('#paging a span').removeClass('active').css('display', 'block');
        $('#paging a#page_' + (prevIndex + 1) + ' span').addClass('active').slideUp(mainInterval);
        prevIndex++;

    });
}

関数内で「var」で宣言されたものはすべてその関数専用であり、関数の外部からアクセスすることはできません。これが、自己呼び出し無名関数を使用する主な理由です。グローバル名前空間を乱雑にすることなく関数と変数を設定できるローカルスコープを提供するためです。

更新されたデモを見てください

于 2012-08-13T16:48:52.003 に答える