IE7不會遵循JQuery鏈接

Question

IE7不會遵循位於頁面底部的JQuery鏈接「collat​​eral」和「branding」。它在其他版本和瀏覽器中轉換得很好。 這裏是我的JQuery文件的代碼：

$(function() { 
    $('#navWeb').click(function() { 
     $('.branding, .collateralT').hide(); 
     $('.webT').fadeIn(); 
    }); 
    $('#navCollateral').click(function() { 
     $('.webT, .branding').hide(); 
     $('.collateralT').fadeIn(); 
    }); 
    $('#navBranding').click(function() { 
     $('.webT, ul.collateralT').hide(); 
     $('.branding').fadeIn(); 
    }); 
}); 

這裏是HTML：

<div id="container"> 
      <nav id="menu"> 
       <section id="contact"> 
        240 481 6963<br> 
        <a href="mailto:y.podlesny@gmail.com">y.podlesny@gmail.com</a> 
       </section> 
       <section id="resume"><a href="files/yuliyaPodlesnyResume.pdf" target="_blank" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('resume','','img/resumeON.jpg',1)"><img src="img/resumeOFF.jpg" alt="resume" name="resume" width="190" height="32" border="0"></a></section> 
       <section id="portfolioMenu"> 
        <a href="#" id="navWeb" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('web','','img/webON.jpg',1)"><img src="img/webOFF.jpg" alt="web" name="web" width="85" height="47" border="0"></a> 
        <a href="#" id="navCollateral" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('collateralOFF','','img/collateralON.jpg',1)"><img src="img/collateralOFF.jpg" alt="commateral material" name="collateralOFF" width="190" height="56" border="0"></a> 
        <a href="#" id="navBranding" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('branding','','img/brandingON.jpg',1)" onClick="getElementById('brandingThumbs')"><img src="img/brandingOFF.jpg" alt="Branding" name="branding" width="190" height="53" border="0"></a> 
       </section> 
     </nav> 
      <section id="slideshow"> 
       <div id="fadeBlock"> 
        <a class="fancybox" rel="group" href="img/thisWeekInWashLong.jpg" id="largeImgClicker"><img src="img/thisWeekInWash.jpg" alt="Large image" id="largeImg" popupimg="img/thisWeekInWashLong.jpg" /></a> 
       </div> 
       <h2>This Week In Washington</h2> 
        <div class="sc_menu"> 
        <ul class="webT" id="webThumbs" input type="image" value="Go"> 
         <li><a href="img/thisWeekInWash.jpg" popupimg="img/thisWeekInWashLong.jpg" id="This Week In Washington" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('thisWeekInWash','','img/keyContactThumbON.jpg',1)"><img src="img/keyContactThumbBlur.jpg" alt="This Week In Wash Newsletter" name="thisWeekInWash" width="126" height="82" border="0"></a></li> 
         <li><a href="img/caissons.jpg" popupimg="img/caissonsLong.jpg" id="Caisson Case Study Discussion Forum" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('caissons','','img/caissonsThumbON.jpg',1)"><img src="img/caissonsThumbBlur.jpg" name="caissons" width="126" height="82" border="0"></a></li> 
         <li><a href="img/asceSite.jpg" popupimg="img/asceSiteLong.jpg" id="ASCE Home Page" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('asceHomePage','','img/asceWebThumbON.jpg',1)"><img src="img/asceWebThumbBlur.jpg" alt="ASCE Home Page" name="asceHomePage" width="126" height="82"/></a></li> 
         <li><a href="img/sustainability.jpg" id="ASCE Committee on Sustainability Site" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('sustainability','','img/sustainabilityThumbON.jpg',1)"><img src="img/sustainabilityThumbBlur.jpg" name="sustainability" alt="ASCE Committee on Sustainability" width="126" height="82"/></a></li> 
        </ul> 
        <ul class="webT" id="webThumbs2" input type="image" value="Go"> 
         <li><a href="img/outreach.jpg" popupimg="img/outreachEnewsLong.jpg" id="Pre-College Outreach" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('outreach','','img/outreachThumbON.jpg',1)"><img src="img/outreachThumbBlur.jpg" alt="Pre-College Outreach" name="outreach" width="126" height="82" border="0"></a></li> 
         <li><a href="img/craneSafety.jpg" popupimg="img/craneSafetyLong.jpg" id="Crane Safety Training Site" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('craneSafety','','img/craneThumbON.jpg',1)"><img src="img/craneThumbBlur.jpg" alt="Crane Safety Training Site" name="craneSafety" width="126" height="82" border="0"></a></li> 
         <li><a href="img/symposium.jpg" id="Aging Buildings Symposium" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('symposium','','img/symposThumbON.jpg',1)"><img src="img/symposThumbBlur.jpg" alt="symposium" name="symposium" width="126" height="82" border="0"></a></li> 
        </ul> 
        <ul class="collateralT" id="print" input type="image" value="Go"> 
         <li><a href="img/mixAnnRep.jpg" id="Mix Annual Report" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('mixAnnRep','','img/mixAnnRepThumbON.jpg',1)"><img src="img/mixAnnRepThumbBlur.jpg" alt="Mix Annual Report" name="mixAnnRep" width="126" height="82" border="0"></a></li> 
         <li><a href="img/stPoster.jpg" popupimg="img/stPosterLong.gif" id="Student Membership Poster" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('stPoster','','img/stPosterThumbON.jpg',1)"><img src="img/stPosterThumbBlur.jpg" alt="Student Membership Poster" name="stPoster" width="126" height="82" border="0"></a></li> 
         <li><a href="img/otc.jpg" id="OTC Hall Of Fame Program" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('otc','','img/otcThumbOn.jpg',1)"><img src="img/otcThumbBlur.jpg" alt="OTC Hall Of Fame Program" name="otc" width="126" height="82" border="0"></a></li> 
         <li><a href="img/stBrochure.jpg" id="ASCE Student Brochure" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('stBrochureStudent B','','img/stBrochureThumbON.jpg',1)"><img src="img/stBrochureThumbBlur.jpg" alt="ASCE Student Brochure" name="stBrochureStudent B" width="126" height="82" border="0"></a></li> 
         <li><a href="img/mixStand.jpg" popupimg="img/mixStandLong.jpg" id="Art Directed &mdash; MIX Exhibition Stand " onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image26','','img/mixStandThumbBlur.jpg',1)"><img src="img/mixStandThumbOn.jpg" alt="MIX Exhibition Stand" name="Image26" width="126" height="82" border="0"></a></li> 
<!--     <li><a href="img/asceMembershipAd.jpg" id="ASCE Student Membership Ad" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('asceMembershipAd','','img/asceMembershipAdThumb.jpg',1)" onClick="fade('fadeBlock');"><img src="img/asceMembershipAdON.jpg" alt="ASCE Student Membership Ad" name="asceMembershipAd" width="126" height="82" border="0"></a></li>--> 
        </ul> 
        <ul class="collateralT" input type="image" value="Go"> 
         <li><a href="img/keyContact.jpg" id="Key Contact Promotional Package" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('keyContact','','img/keyContactPrintThumbON.jpg',1)"><img src="img/keyContactPrintThumbBlur.jpg" alt="Key Contact Promotional Package" name="keyContact" width="126" height="82" border="0"></a></li> 
         <li><a href="img/chocolatStand.jpg" id="ChocolatFL Exibition Stand" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('chocolatFL','','img/chocolatflThumbON.jpg',1)"><img src="img/chocolatflThumbBlur.jpg" alt="ChocolatFL Exibition Both" name="chocolatFL" width="126" height="82" border="0"></a></li> 
         <li><a href="img/insa.jpg" id="INSA Folder With Letterhead" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('insa','','img/insaThumbON.gif',1)"><img src="img/insaThumbBlur.jpg" alt="INSA Folder With Letterhead" name="insa" width="126" height="82" border="0"></a></li> 
         <li><a href="img/tribe.jpg" popupimg="img/tribeLong.gif" id="Indian Tribes Exhibition Stands " onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('tribe','','img/tribeThumbON.jpg',1)"><img src="img/tribeThumbBlur.jpg" alt="Indian Tribes Exhibition Stands" name="tribe" width="126" height="82" border="0"></a></li> 
        </ul> 
        <ul class="branding" input type="image" value="Go"> 
         <li><a href="img/clarksFarm.gif" id="Clark's Farm Logo" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('farm','','img/farmThumbON.gif',1)"><img src="img/farmThumbBlur.jpg" alt="Clark's Farm " name="farm" width="126" height="82" border="0"></a></li> 
         <li><a href="img/failingInfr.gif" id="Our Critical Infrastructure Logo" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('infr','','img/infrThumbON.gif',1)"><img src="img/infrThumbBlur.jpg" alt="Our Critical Infrastructure Logo" name="infr" width="126" height="82" border="0"></a></li> 
         <li><a href="img/waterRes.gif" id="Water Resources Coalition Logo" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('water','','img/waterResThumbON.gif',1)"><img src="img/waterResThumbBlur.jpg" alt="Water Resources Coalition" name="water" width="126" height="82" border="0"></a></li> 
         <li><a href="img/bas.gif" id="Bounds Appraisal Services Logo" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('bas','','img/basThumbsON.gif',1)"><img src="img/basThumbsBlur.jpg" alt="Bounds Appraisal Services" name="bas" width="126" height="82" border="0"></a></li> 
        </ul> 
        <ul class="branding"> 
         <li><a href="img/jc.gif" id="Job Continent Logo" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('jc','','img/jcThumbON.gif',1)"><img src="img/jcThumbBlur.jpg" alt="Job Continent Logo" name="jc" width="126" height="82" border="0"></a></li> 
        </ul> 
       </div> 
      </section> 
</div> 
    enter code here 

Answer 1

有幾個人報告的問題在IE7，並且都涉及到像大多數使用的document.ready功能jQuery的。 IE與它有不同的行爲。試着改變你的JS代碼：

$(function() { 
$('#navWeb').click(function() { 
    $('.branding, .collateralT').hide(); 
    $('.webT').fadeIn(); 
}); 
$('#navCollateral').click(function() { 
    $('.webT, .branding').hide(); 
    $('.collateralT').fadeIn(); 
}); 
$('#navBranding').click(function() { 
    $('.webT, ul.collateralT').hide(); 
    $('.branding').fadeIn(); 
}); 
}); 

要：

$(document).ready(function() { 
    myInit(); 
}); 

function myInit() { 
$('#navWeb').click(function() { 
    $('.branding, .collateralT').hide(); 
    $('.webT').fadeIn(); 
}); 
$('#navCollateral').click(function() { 
    $('.webT, .branding').hide(); 
    $('.collateralT').fadeIn(); 
}); 
$('#navBranding').click(function() { 
    $('.webT, ul.collateralT').hide(); 
    $('.branding').fadeIn(); 
}); 
}