jQuery函數.bind不是在IE

Question

This is my website

工作如果您點擊小縮略圖更大的圖像顯示。在Chrome中，它的工作原理非常完美，但是當我在IE9中嘗試它時，它並沒有做任何事情。這裏是我的代碼：

jQuery的

// JavaScript Document 

//Button1 
;(function($) { 

     // DOM Ready 
     $(function() { 

      // Binding a click event 
      // From jQuery v.1.7.0 use .on() instead of .bind() 
      $('#my-button').bind('click', function(e) { 

       // Prevents the default action to be triggered. 
       e.preventDefault(); 

       // Triggering bPopup when click event is fired 
       $('#element_to_pop_up').bPopup({ 
        appendTo: 'form' 
        , zIndex: 2 
        , modalClose: false 
       }); 
      }); 
     }); 
    })(jQuery); 
//Button2 



    ;(function($) { 

     // DOM Ready 
     $(function() { 

      // Binding a click event 
      // From jQuery v.1.7.0 use .on() instead of .bind() 
      $('#my-button1').bind('click', function(e) { 

       // Prevents the default action to be triggered. 
       e.preventDefault(); 

       // Triggering bPopup when click event is fired 
       $('#element_to_pop_up1').bPopup({ 
        appendTo: 'form' 
        , zIndex: 2 
        , modalClose: true 
       }); 
      }); 
     }); 
    })(jQuery); 


    ;(function($) { 
//Button3 


     // DOM Ready 
     $(function() { 

      // Binding a click event 
      // From jQuery v.1.7.0 use .on() instead of .bind() 
      $('#my-button2').bind('click', function(e) { 

       // Prevents the default action to be triggered. 
       e.preventDefault(); 

       // Triggering bPopup when click event is fired 
       $('#element_to_pop_up2').bPopup({ 
        appendTo: 'form' 
        , zIndex: 2 
        , modalClose: false 
       }); 
      }); 
     }); 
    })(jQuery); 

而我的HTML

<!-- Portfolio Popup Box --> 

    <div id="element_to_pop_up"> 
      <a class="bClose">x<a/> 
      <img src="imgs/portfolio/bobbie.png" width="100%" height="100%" alt="Bobbie Gordon Website" /> 
    </div> 

    <div id="element_to_pop_up1"> 
      <a class="bClose">x<a/> 
      <img src="imgs/portfolio/jareth.png" width="100%" height="100%" alt="Bobbie Gordon Website" /> 
    </div> 

    <div id="element_to_pop_up2"> 
      <a class="bClose">x<a/> 
    </div> 

<!-- Portfolio Popup Box End --> 

CSS

#element_to_pop_up { 
    padding:5px; 
    color:#000; 
    display:none; 
    width:90%; 
    height: 100%; 
    position:absolute; 
    border:1px solid #000; 
} 
#element_to_pop_up1 { 
    padding:5px; 
    color:#000; 
    display:none; 
    width:90%; 
    height: 90%; 
    position:absolute; 
} 
#element_to_pop_up2 { 
    padding:5px; 
    color:#000; 
    display:none; 
    width:90%; 
    height: 90%; 
    position:absolute; 
} 

.bClose{ 
    cursor:pointer; 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    font-size:22px; 
    font-weight:bold; 
} 

我敢肯定它是值得做的onclick綁定。也許IE不承認它？或者只要您點擊它即可取消，從而避免任何事情發生。

謝謝大家。

感謝Sparky現在已經修復了這個問題！

Answer 1

將您的.bind()轉換爲.on()或降級您的jQuery版本。您的網站正在運行jQuery 1.9 which has removed nearly all deprecated features。你也可以包括migrate plugin。

而且，網站在資源管理器中正常工作的希望，你必須先驗證HTML：

http://validator.w3.org/check?uri=http%3A%2F%2Fjohns-webdesign.com%2Fport.html&charset=%28detect+automatically%29&doctype=Inline&group=0