클릭 시뮬레이션이 작동하지 않습니다 ... jQuery

Question

td 클래스가 "nee"인 경우 jquery로 클릭을 시뮬레이션하려고합니다. 어떻게 든 트리거 같은 모든 옵션, 문서 준비를 클릭 작동 실 거예요 ...

HTML :

<td align="center" class="one nee"> 
    <img class="img-swap" src="images/nee.png" alt="Aanwezigheid"/> 
</td> 

트리거 조치 :

$(document).ready(function(){ 
      $('#some-id').trigger('click'); 
    }); 

하는 HTML 반환 변수가 표준이라는 이미지 값은 "ja.png"입니다. 그러나 항목이 데이터베이스에서 no로 설정되면 이미지가 nee.png로 변경됩니다. 그러나 그것이 트리거되면, 입력 필드가 나타나기를 원하는데, ja.png를 클릭하여 nee.png로 변경했을 때 나타나는 것과 같은 방식입니다. 페이드 인으로 작동합니다. 별도로 작동합니다. fadein 행동에 대한

 $(document).ready(function(){ 
      $(".img-swap").click("click", function() { 
      if ($(this).attr("class") == "img-swap") { 
       this.src = this.src.replace("ja","nee"); 
      } else { 
       this.src = this.src.replace("nee","ja"); 
      } 
      $(this).toggleClass("ja"); 
      }); 
     }); 

코드 :하지만 난 .. 클릭을 시뮬레이션 할 수

이미지 changeing 코드를 얻을 어차피 나를 도울 수

 $(document).ready(function(){  
      $(".nee").trigger("click"); 
      $("td.one").click("click", function(){ 

       if ($(this).parent().find("td.two, td.three").hasClass("toggled")){ 
        $(this).parent().find("td.two").fadeOut(400); 
        $(this).parent().find("td.three").fadeOut(400); 
        $(this).parent().find("td.two").removeClass("toggled"); 
        $(this).parent().find("td.three").removeClass("toggled"); 

       } else { 

        if ($(this).parent().find("td.three").hasClass("DoNotWant")){ 
         $(this).parent().find("td.three").fadeOut(400); 
         $(this).parent().find("td.three").toggleClass("DoNotWant"); 
        } else { 
         $(this).parent().find("td.three").fadeIn(400); 
         $(this).parent().find("td.three").toggleClass("toggled"); 
        } 

        $(this).parent().find("td.two").fadeIn(400); 
        $(this).parent().find("td.two").toggleClass("toggled"); 
       }     
      }); 

      $("td.two").click("click", function(){ 

       if ($(this).parent().find("td.three").hasClass("toggled")){ 
        $(this).parent().find("td.three").fadeOut(400); 
        $(this).parent().find("td.three").removeClass("toggled"); 
        $(this).parent().find("td.three").toggleClass("DoNotWant"); 

       } else { 
        $(this).parent().find("td.three").fadeIn(400); 
        $(this).parent().find("td.three").toggleClass("toggled"); 

       } 
      });    
     }); 

누구를?

라이브 예는 여기에 있습니다 : 대신 클릭을 유발의 는 http://bryan.limewebsolutions.nl/

Answer 1

.click() 당신이하지 않아도 함수의 이벤트 유형 (click)를 주 셨으니, .bind('click')에 대한 바로 가기입니다.

.click("click", function(){을 .click(function(){으로 변경하면 방아쇠가 올바르게 작동합니다.

Answer 2

, 나는 그냥 콜백 함수에 대한 참조를 저장하는 것이 더 쉽습니다 말을 한 다음 클릭 -로 그 기준을 모두 사용할 것 이벤트 콜백을 수행 한 다음 클릭 이벤트를 트리거하는 대신 i를 개별적으로 호출 할 수 있습니다. 이런 식으로 뭔가 : 내가 믿는

1. 가있다 :이 예에서

   var callback = function(){ 
       if ($(this).parent().find("td.two, td.three").hasClass("toggled")){ 
        $(this).parent().find("td.two").fadeOut(400); 
        $(this).parent().find("td.three").fadeOut(400); 
        $(this).parent().find("td.two").removeClass("toggled"); 
        $(this).parent().find("td.three").removeClass("toggled"); 
   
       } else { 
   
        if ($(this).parent().find("td.three").hasClass("DoNotWant")){ 
         $(this).parent().find("td.three").fadeOut(400); 
         $(this).parent().find("td.three").toggleClass("DoNotWant"); 
        } else { 
         $(this).parent().find("td.three").fadeIn(400); 
         $(this).parent().find("td.three").toggleClass("toggled"); 
        } 
   
        $(this).parent().find("td.two").fadeIn(400); 
        $(this).parent().find("td.two").toggleClass("toggled"); 
       }     
   }; 
   
   // Bind the click event 
   $("td.one").click("click", callback); 
   $(function() { 
       // Instead of triggering a click, just call the function 
       callback(); 
   }); 
   

   는 td.two에 대한 콜백은 예제의 단순화를 위해

   사이드 노트를 두었습니다 if 문에서 선택자와 일치하는 td가 두 개 이상있는 경우 여기에 논리와 관련된 문제가 있습니다. 이 경우 일치하는 첫 번째 요소는 클래스가 toggled인지 여부를 확인할 때 항상 사용됩니다. .hasClass()은 일치 요소 집합의 첫 번째 요소를 평가합니다.

2. DOM 통과 횟수를 줄여 코드를 효율적으로 만들 수 있습니다. 콜백에서 부모 변수에 대한 참조를 변수에 저장하고 매번 $(this).parent()을 호출하는 대신 해당 변수를 사용합니다.