2013-08-23 24 views
0

webapp (저는 JavaScript가 새로 도입되었습니다)를 작성 중이며 jquery는 .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/를)

+3

어디에서 loadTabBar()를 호출합니까? 귀하의 바이올린은 그것을 호출하지 않으므로 이벤트 핸들러가 생성되지 않습니다. 이것이 당신이 기대하는 행동입니까 : http://jsfiddle.net/hFBMB/2/? –

+0

이러한 기능을 언제 어디서 호출합니까? –

+0

당신이 원하는 각 함수를'$ (function() {});에 두어야합니다. –

답변

2

loadTabBar()를 호출하거나 loadTabBar() 대신 코드를 넣을 수 있습니다.

$(document).ready(function(){ 

//code goes here 

}); 
+1

그래, 모든 기능을 선언 할 때까지 모든 것을 문서로 옮깁니다. 문서 준비가되어 있지 않아야합니다. – SeanKendle

1

너는 loadTabBar()에게 전화 한 적이 없다. 왜 그 안에 모든 걸 감쌌는지 모르겠다.

1

내부에서 물건을 사용하려면 먼저 loadTabBar() 기능에 전화해야합니다. 함수를 호출하면 클릭이 작동합니다.

관련 문제