任何人都可以給我如何得到這個工作在ie的建議嗎？

Question

在Firefox中運行良好，但在ie中沒有任何作用。

<script type="text/javascript"> 
$(document).ready(function(){ 
    var links = $('.bound'); 
    var west = $('.west'); 
    var west2 = $('.west2'); 
    var west3 = $('.west3'); 
    var west4 = $('.west4'); 
    west2.hide(); 
    west3.hide(); 
    west4.hide(); 
    links.click(function(event){ 
     west.hide(); 
     west2.hide(); 
     west3.hide(); 
     west4.hide(); 
     west.filter('.' + event.target.id).show(); 
     west2.filter('.' + event.target.id).show(); 
     west3.filter('.' + event.target.id).show(); 
     west4.filter('.' + event.target.id).show(); 
    }); 
}); 
</script> 

HTML

<div class="tabset"> 
      <div id="tab1" class="tab-box"> 
       <div class="form-holder"> 
        <form action="#"> 
         <fieldset> 
          <label for="lb02"><strong>Choose District:</strong></label> 
          <select id="lb02"> 
           <option class="bound" id="west">WEST</option> 
           <option class="bound" id="west2">WEST2</option> 
           <option class="bound" id="west3">WEST3</option> 
           <option class="bound" id="west4">WEST4</option> 
          </select> 
         </fieldset> 
        </form> 
       </div> 
       <div class="report-box"> 
        <table> 
         <thead> 
          <tr> 
           <td class="name">Name</td> 
           <td class="department">Department</td> 
           <td class="title">Title</td> 
           <td class="district">District</td> 
           <td class="profile">&nbsp;</td> 
          </tr> 
         </thead> 
         <tbody> 
          <tr class="west"> 
           <td>Name1</td> 
           <td>Dept2</td> 
           <td>Title2</td> 
           <td>West</td> 
           <td><a class="btn-profile" href="#">PROFILE</a></td> 
          </tr> 
          <tr class="west2"> 
           <td>Name2</td> 
           <td>Dept2</td> 
           <td>Title2</td> 
           <td>West2</td> 
           <td><a class="btn-profile" href="#">PROFILE</a></td> 
          </tr> 
         </tbody> 
        </table> 
       </div> 
      </div> 

Answer 1

代替在option元素click事件，使用select元件上的change事件。

var links = $('#lb02'), 
    wests = $('.west,.west2,.west3,.west4'); 
wests.not('.west').hide(); 
links.change(function(event) { 
    wests.hide().filter('.' + this.options[this.selectedIndex].id).show(); 
}); 

Answer 2

這可能是因爲IE不能識別event.target，它採用了srcElement屬性。此外，IE可能不會將事件參數傳遞給處理程序，因此您必須搶到window.event。爲了您的點擊功能的嘗試：

links.click(function(event){ 
    var e = event || window.event, 
     et = (e.target) ? e.target : e.srcElement; 

     west.hide(); 
     west2.hide(); 
     west3.hide(); 
     west4.hide(); 
     west.filter('.' + et.id).show(); 
     west2.filter('.' + et.id).show(); 
     west3.filter('.' + et.id).show(); 
     west4.filter('.' + et.id).show(); 
});