addClass Ajax로드하기 전에

Question

jQuery의 브라우저에 표시되기 전에 Ajax가로드 된 페이지에 포함 된 요소에 클래스를 추가하려고 시도 중입니다. 순간에 어떻게됩니까

$("#landing li.nav4 a").live('click', function() { 
    $("#landing").fadeOut('slow', function(){ 
     $('#agency').load('assets/ajax/agency.html').fadeIn(function(){ 
      $("#agency-main nav li.nav1 a").addClass("nav1-on"); 
     }); 
    }); 
    return false; 
}); 

는 페이지가로드 된 다음 클래스가 추가되고로드 된 클래스 (배경 이미지)와 같은 눈에 띄는 "플래시"이 : 여기 내 코드입니다.

콘텐츠를로드하고 클래스를 추가 한 다음 fadeIn을 순서대로 삽입 하시겠습니까?

Answer 1

저는 jquery 멍청한 녀석이에요. 제 자신의 학습에 더 많은 것이 있습니다. (그런데 무겁게 이상의 자격을 갖춘 선택!)`` "는 li.nav1 # 기관 메인 탐색은"해당 클래스를 추가해야하기 위해 문서에 사용할 수있을 때

//make sure #agency is defaulted to display:none, or add a line to check this 
$("#landing li.nav4 a").live('click', function() { 
    $('#agency').load('assets/ajax/agency.html', function() { 
    $("#agency-main nav li.nav1 a").addClass("nav1-on"); 
    }); 
    $("#landing").fadeOut('slow', function(){ 
    $('#agency').fadeIn(); 
    }); 
    return false; 
}); 

Answer 2

클래스를 백그라운드에 연결하려는 요소를 만든 다음 원하는 경우 삽입 할 수 있습니다. 당신이 jsfiddle에 코드를 작성할 수있는 경우

같은 ..

el = $("#landing"); 
//fadeout el 
//remove from html 
//add class 
//insert it back in 

, thta 매우 도움이 :)

Answer 3

가 nutbar 전화 해가 될 것입니다,하지만 난 모든 당신이 필요로 할 때 만 콜백을 해독 싫어

: 당신이 걸릴하거나 떠날 수 2 개 다른 권장 개선

$("#landing li.nav4 a").on('click', function(event) { 
    event.preventDefault(); // better than return false; 
    $agency = $('#agency'); // cache it since we use it twice 

    // fade out the landing div, and when that's done load agency.html into #agency 
    // presumably, #agency is already hidden 
    $("#landing").fadeOut('slow', function(){ 
    $agency.load('assets/ajax/agency.html'); 
    }); 

    // add the class to the nav item 
    $("#agency-main nav li.nav1 a").addClass("nav1-on"); 

    // fade #agency in 
    $agency.fadeIn(); 
}); 

주의 사항 : 이벤트의 관리 순서는

1. .on()에 대한 .live()는 jQuery 1.7에서 사용할 수 있습니다. 이전 jQuery를 사용하는 경우 .live() 대신 .delegate()를 계속 살펴 봐야합니다.

2. 012P은 preventDefault()를 사용하여 클릭 이벤트가 기본값으로 버블 링되는 것을 중지합니다. 이는 코드를 검토 할 때보다 효율적이며 이해하기 쉽습니다.