Jquery在IE7上崩溃

Question

HTML:

<div id="overlay_weekPrize"> 
    <div class="prizePopupBanner">

    </div>
  <div id="weeklyPrizeImageBanner"><!--the big banner images/weeklyPrizeImageBanner-->
    <div id="week1"><img src="images/bts/bts_overlay_weekly_prize_week1.png" alt="week prize"  /></div>
    <div id="week2" class="inactive_banner"><img src="images/bts/bts_overlay_weekly_prize_week2.png" alt="week prize"  /></div>
    <div id="week3" class="inactive_banner"><img src="images/bts/bts_overlay_weekly_prize_week3.png" alt="week prize"  /></div>
    <div id="week4" class="inactive_banner"><img src="images/bts/bts_overlay_weekly_prize_week4.png" alt="week prize"  /></div>
    <div id="week5" class="inactive_banner"><img src="images/bts/bts_overlay_weekly_prize_week5.png" alt="week prize"  /></div>
  </div>
  <div id="weeklyPrizeBlocksWrapper"><!--the outer vector box-->
    <ul id="weeklyPrizeBlockThumb">
      <li class="active"> <img src="images/bts/bts_overlay_wp_box_thumbw1_active.jpg" alt="Week1" id="week1" />
        <p class="text"> </p>
      </li>
      <li> <img src="images/bts/bts_overlay_wp_box_thumbw2_active.jpg" alt="Week2" id="week2" />
        <p class="text"> </p>
      </li>
      <li> <img src="images/bts/bts_overlay_wp_box_thumbw3_active.jpg" alt="Week3" id="week3" />
        <p class="text"> </p>
      </li>
    </ul>
    <ul id="weeklyPrizeBlockThumb">
      <li> <img src="images/bts/bts_overlay_wp_box_thumbw4_active.jpg" alt="Week4" id="week4" />
        <p class="text"> </p>
      </li>
      <li> <img src="images/bts/bts_overlay_wp_box_thumbw5_active.jpg" alt="Week5" id="week5" />
        <p class="text"> </p>
      </li>
    </ul>
    </ul>
  </div>

JavaScript的:

 var currentID=$('div#weeklyPrizeActiveBlock').find('span').html();
   $('#weeklyPrizeImageBanner div').hide(); // Hide All Banner DIV's
   $('#weeklyPrizeImageBanner').find('div[id^='+currentID+']').show(); 
   $('ul#weeklyPrizeBlockThumb li').removeClass('active');
   $('ul#weeklyPrizeBlockThumb').find('li[id^='+currentID+']').addClass('active');
   var activePrize=$("div#weeklyPrizeActiveBlock").find('img[id^='+currentID+']').attr('src');
   $('ul#weeklyPrizeBlockThumb li').find('img[id^='+currentID+']').attr("src", activePrize);

    $('ul#weeklyPrizeBlockThumb li').click(function()
    {
    $('ul#weeklyPrizeBlockThumb li').removeClass('active'); //Remove Class Active from LI
        $(this).addClass('active'); //Active Image Thumb
        var imgID = $(this).find('img').attr('id'); //Find Thumb Image ID
        $('#weeklyPrizeImageBanner div').hide(); // Hide All Banner DIV's
        $('#weeklyPrizeImageBanner').find('div[id^='+imgID+']').show(); //Show Current Banner
        var activeSrc=$('div#weeklyPrizeActiveBlock').find('img[id^='+imgID+']').attr('src');

        $("div#weeklyPrizeInActiveBlock>img").each(function(index){
           var k= $(this).attr('src');
            index1="week"+index;
          $('ul#weeklyPrizeBlockThumb li').find('img[id^='+index1+']').attr('src',k);

        })
        $(this).find('img').attr("src", activeSrc);

    }
    );

发生了什么事.jQuery没有在第二组lis上工作.他们不响应点击.这只发生在IE7上.其余的浏览器工作得非常好.

编辑:我尝试将id更改为class.但它仍然无效.我尝试更改第二个ID的名称并重新配置脚本.仍然没有奏效.问题出在其他地方.

Answer 1

首先,你真的应该通过删除那些重复的ID来纠正你的标记.然后加入var到index1 = "week" + index;

而已.

有关此问题的更多信息,请访问:http://ragrawal.wordpress.com/2007/10/25/top-5-reasons-why-ie7-is-complaining-about-your-javascript/