Số của danh sách được sắp xếp thành 0 khi nhấp vào các tab jquery máng

Question

Tôi có một trang có các tab jQuery trên đó. Trong các tab đó là danh sách có thứ tự.

Đây là mã html của tôi:

<div id="tabs"> 

    <ul> 
     <li><a href="#tabs-1">Nunc tincidunt</a></li> 
     <li><a href="#tabs-2">Proin dolor</a></li> 
     <li><a href="#tabs-3">Aenean lacinia</a></li> 
    </ul> 

    <div id="tabs-1"> 
     <ol start="50"> 
      <li>Bibendum Elit</li> 
      <li>Vehicula</li> 
      <li>Amet Bibendum Ultricies</li>   
     </ol> 
    </div> 

    <div id="tabs-2"> 
     <ol> 
      <li>Sollicitudin Cras Vehicula</li> 
      <li>Vulputate Euismod</li> 
      <li>Ridiculus Vehicula Pharetra Nullam</li>   
     </ol> 
    </div> 

    <div id="tabs-3"> 
     <ol> 
      <li>Ullamcorper Parturient</li> 
      <li>Tristique Mollis Venenatis Vehicula</li> 
      <li>Vulputate Bibendum</li>   
     </ol> 
    </div> 
</div> 

và đây là javascript của tôi:

$(function() { $("#tabs").tabs(); });

Xem: http://jsfiddle.net/2ewzz/1/

Khi tôi xem này trong IE9, và tôi nhấp từ tab đầu tiên vào tab thứ hai và sau đó quay trở lại tab đầu tiên một lần nữa, tất cả các số được đổi thành "0"

Có ai biết tôi đang làm gì sai hay cách giải quyết vấn đề này?

Answer 1

Điều này có vẻ là một vấn đề trong chính IE khi xem xét điều này có liên quan question.

Tôi đã có thể khắc phục sự cố này bằng cách tạo lại bộ đếm trên các mục danh sách khi chọn lại tab.

$(function() { 
    $("#tabs").tabs({ 
     select: function(event, ui){ 
      var ol = $($(ui.panel).children()[0]); 
      setTimeout(function(){ 
      ol.children().css("counter-reset", "item") 
      }, 1); 
     } 
    }); 
}); 

Check-out jsFiddle này cho một ví dụ làm việc

Answer 2

http://www.w3schools.com/tags/att_ol_start.asp Nó hoạt động với chế độ tương thích IE9.

Answer 3

Dựa trên câu trả lời @sriniris, nếu bạn có nhiều danh sách:

<script type="text/javascript"> 
    $(function() { 
     $("#tabs").tabs({ 
      activate: function (event, ui) { 
       $(".olReset").each(function() { 
        var ol = $(this); 
        setTimeout(function() { 
         ol.children().css("counter-reset", "item") 
        }, 1); 
       }); 
      } 
     }); 
    }); 
</script> 

Chỉ cần áp dụng .olReset lớp vào danh sách của bạn.

Ngoài ra, select đã bị khấu hao.

Answer 4

Tôi có vấn đề này quá nhưng thông qua một trùng hợp ngẫu nhiên của bộ phận CNTT của tôi triển khai bản vá này http://support.microsoft.com/kb/2909921 (cập nhật IE9 để cập nhật phiên bản 9.0.24) và vấn đề đi đi