0

私は webapp を構築しています (javascript は初めてです)。.click リスナーが接続されているものをクリックすると、jquery は何もしません。さらに、アニメーション化されません。私は何か間違ったことをしています、そして何が理解できません。

コード:

 function loadTabBar()
{
    person = false;
    sale = false;
    current = false;
    wine = false;
    if(!person && !sale && !current && !wine)
    {
        justOpened();
    }

    function useTabBar(){

    $('#PersonDiv').click(function()
    {
        alert('hi')
        activatePerson();
    });
    $('#Current').click(function()
            {
                activateCurrent();
            });
    $('#Sale').click(function()
            {
                activateSale();
            });
    $('#Wine').click(function()
            {
                activateWine();
            });

    function activatePerson()
    {
        if(!person)
        {
            var newImg="#Person";
            if(sale)
            {
                var oldImg="#Sale"
                changeImg(oldImg, newImg);
            }
            if(wine)
            {
                var oldImg="#Sale"
                changeImg(oldImg, newImg);
            }
            if(current)
            {
                var oldImg="#Sale"
                changeImg(oldImg, newImg);
            }
            person = true;
            current = false;
            wine = false;
            sale = false;

        }
    }
    function activateSale()
    {
        if(!sale)
        {
            var newImg="#Sale"
            if(person)
            {

                var oldImg="#Person"
                changeImg(oldImg, newImg);
            }
            if(wine)
            {
                var oldImg="#Wine"
                changeImg(oldImg, newImg);
            }
            if(current)
            {
                var oldImg="#Current"
                changeImg(oldImg, newImg);
            }
            person = false;
            current = false;
            wine = false;
            sale = true;
        }
    }
    function activateWine()
    {
        if(!wine)
        {
            var NewImg = "#Wine"
            if(sale)
            {
                var oldImg="#Sale"
                changeImg(oldImg, newImg);
            }
            if(person)
            {
                var oldImg="#Person"
                changeImg(oldImg, newImg);
            }
            if(current)
            {
                var oldImg="#Current"
                changeImg(oldImg, newImg);
            }
            person = false;
            current = false;
            wine = true;
            sale = false;
        }
    }
    function activateCurrent()
    {
        var newImg = "#Current";
        if(!current)
        {
            if(sale)
            {
                var oldImg="#Sale"
                changeImg(oldImg, newImg);
            }
            if(wine)
            {
                var oldImg="#Wine"
                changeImg(oldImg, newImg);
            }
            if(person)
            {
                var oldImg="#Person"
                changeImg(oldImg, newImg);
            }
            person = false;
            current = true;
            wine = false;
            sale = false;
        }
    }
    function changeImg(oldImg, newImg)
    {
            $(oldImg).fadeOut('fast', function()
            {
                $(this).attr('src', ('http://www.jagspcmagic.com/' + oldImg.substring(1) + '1.png'), function(){
                    if(this.complete) $(this.fadeIn('fast'));
                });
            })                              
            $(newImg).fadeOut('fast', function()
            {
                $(this).attr('src', ('http://www.jagspcmagic.com/' + oldImg.substring(1) + '2.png'), function(){
                    if(this.complete) $(this.fadeIn('fast'));
                });
            })

    }
}function justOpened()
{
    $('#Person').fadeOut('fast', function()
            {
                $('#Person').attr('src', 'http://www.jagspcmagic.com/Person2.png', function(){
                    $(this.fadeIn('fast'));
                });
            })  
    person = true;
    useTabBar();
}}

JSfiddle: (ひどいグラフィックは気にしないでください。実際のグラフィックにはまだ著作権がないため、アップロードしたくありませんでした。http://jsfiddle.net/hFBMB/ )

4

3 に答える 3