2011-01-31 48 views
1

這個腳本在IE瀏覽器& FF工作正常,但不在Safari 5中。它似乎不是初始化(即沒有任何工作)。腳本會一次顯示錶格的一行,隱藏其他行,直到點擊下一個或上一個。原文可以在halifaxhype.com上查看如果任何人都可以提出建議,我將不勝感激,因爲我通常不使用java腳本或Jquery或Safari。 (Java腳本,然後由下面的HTML - 由於發佈從HTML除去限制錨鏈接和圖像鏈接)jquery JavaScript不工作在Safari 5

JS - 初始

$(document).ready(function() { 
$('#myTable').paginateTable({ rowsPerPage: 1 }); 
}); 

JS - 主

(function ($) { 

    $.fn.paginateTable = function(options) { 

     var settings = jQuery.extend({ 
      rowsPerPage: 1,    /* the number of rows that comprise a page */ 
      nextPage: ".nextPage", /* selector for "Next Page" dom element. Click to change page. */ 
      prevPage: ".prevPage", /* selector for "Previous Page" dom element. Click to change page. */ 
      currentPage: ".currentPage", /* selector for "Current Page" dom element. Display only. */ 
      totalPages: ".totalPages", /* selector for "Total Pages" dom element. Display only. */ 
      pageNumbers: ".pageNumbers", /* selector for container for autogenerated page number links */ 
      pager: ".pager", 
      pagernext: ".pagernext", 
      pagerprev: ".pagerprev",   /* selector for container of all paging dom elements */ 
      autoHidePager: true  /* hides the pager (see selector above) if there is only a single page */ 
     }, options || {}); 

     return this.each(function(){ 

      var table = $(this); 
      var pager = $(settings.pager); 
      var pagernext = $(settings.pagernext); 
      var pagerprev = $(settings.pagerprev); 
      var nextPage = pagernext.find(settings.nextPage); 
      var prevPage = pagerprev.find(settings.prevPage); 
      var currentPage = pager.find(settings.currentPage); 

      nextPage.click(function(){ 
        var pageNum = getCurrentPage(currentPage.text()); 
        displayPage(table, pageNum+1, settings); 
        return false; 
       }); 

      prevPage.click(function(){ 
        var pageNum = getCurrentPage(currentPage.text()); 
        displayPage(table, pageNum-1, settings); 
        return false; 
       }); 

      displayPage(table, getCurrentPage(currentPage.text()), settings); 
     }); 
    }; 

    function getCurrentPage(pageText){ 
     var pageNum = parseInt(pageText,10); 
     if (isNaN(pageNum)){ 
      pageNum = 0; 
     } 
     return Math.max(1, pageNum); 
    } 

    function displayPage(table, pageNum, settings){ 
     pageNum = Math.max(1, pageNum); 

     if (settings.rowsPerPage > 0){ 
      var rows = table.find("tbody tr"); 
      var totalPages = Math.ceil(rows.size()/settings.rowsPerPage); 

      if (pageNum <= 1){ 
        $(settings.pagerprev).hide(); 
        } 
     if (pageNum > 1){ 
        $(settings.pagerprev).show(); 
        } 
     if (pageNum >= totalPages){ 
        $(settings.pagernext).hide(); 
        } 
     if (pageNum < totalPages){ 
        $(settings.pagernext).show(); 
        }   

      if (settings.autoHidePager && totalPages <= 1){ 
       $(settings.pager).hide(); 
      }  



      else if (totalPages > 0){ 

       pageNum = Math.min(pageNum, totalPages); 
       var rowStartIndex = (pageNum - 1) * settings.rowsPerPage; 
       var rowEndIndex = pageNum * settings.rowsPerPage; 
       $.each(rows, function(index, row){ 
        if (index >= rowStartIndex && index < rowEndIndex){ 
         $(row).show(); 
        } 
        else{ 
         $(row).hide(); 
        } 
       }); 

       var pager = $(settings.pager); 
       pager.find(settings.currentPage).text(pageNum); 
       pager.find(settings.totalPages).text(totalPages); 

       var pageNumbers = pager.find(settings.pageNumbers); 
       if (pageNumbers.size() > 0){ 
        pageNumbers.empty(); 
        for(var i = 1; i <= totalPages; i++) { 
         pageNumbers.append("<a href='#' id='" + i + "'>" + i + "</a>"); 
        } 

        pageNumbers.children('a').click(function(){ 
         displayPage(table, $(this).attr("id"), settings); 
         return false; 
        }); 
       } 
      } 

     } 
    } 

})(jQuery); 

HTML

<!-- Main Body (middle) --> 
<table><tr> 
<td style='padding-left: 0px; padding-right: 0px; height: 275px; ; width: 666px;' > 

<!-- Table to Contain 1-Prev, 2-Events, 3-Next --> 
<table border=0 bordercolor=orange width='100%' cellpadding='0' cellspacing='0'><tr> 
<!-- 1-Prev --> 
<td width='25' valign='middle' align='center'> <div class='pagerprev'> 

<a href='#' alt='Previous' class='prevPage'> <PREV image link removed</div> </td> 

<!-- 2-Events --> 
<td> 
    <!-- Table for Events This is what Slides in and out--> 

    <table id="myTable" border=0 bordercolor=red width=100%><tbody> 

<!--- Event loop#1 Event ID#52 ---> 
    <tr><td style='padding-left: 15px; padding-right: 15px;' valign='top' width='508'><div class='eslider' align='left' style='float: left; width=200'>image</div><div id='eslider' align='right' style='float: right;width=300'><span style='font-family: Verdana; color: #ffffff; font-size: 23px; font-weight: bold;'>Bitter End</span><br><span style='font-family: Verdana; color: #D4D4D4; font-size: 18px;'>Martini Monday at The Bitter End!</span> <hr height='1' width='100%'><span style='font-family: Verdana; color: #D4D4D4; font-size: 12px;'> <p>Absolutely the best place to be on a Monday night in Halifax! Featuring a discounted martini menu and DJ Nigel Lutes. Disc<br><br>Mon, Jan 31, 2011 - All Day </div> </center></td></tr> 
<!--end event--> 

<!--- Event loop#2 Event ID#95 ---> 
    <tr><td style='padding-left: 15px; padding-right: 15px;' valign='top' width='508'><div class='eslider' align='left' style='float: left; width=200'>image</div><div id='eslider' align='right' style='float: right;width=300'><span style='font-family: Verdana; color: #ffffff; font-size: 23px; font-weight: bold;'>Mexicali Rosa's</span><br><span style='font-family: Verdana; color: #D4D4D4; font-size: 18px;'>Double Margaritas! Only $6.00!</span> <hr height='1' width='100%'><span style='font-family: Verdana; color: #D4D4D4; font-size: 12px;'> <p>Every Monday!<br />- Double Margaritas! Only $6.00! (Taxes in)<br />- 32 oz. Canadian or Coors Light Draught - $8.99</p> 
<br><br>Mon, Jan 31, 2011 - All Day </div> </center></td></tr> 
<!--end event--> 

<!--- Event loop#3 Event ID#54 ---> 
    <tr><td style='padding-left: 15px; padding-right: 15px;' valign='top' width='508'><div class='eslider' align='left' style='float: left; width=200'>image</div><div id='eslider' align='right' style='float: right;width=300'><span style='font-family: Verdana; color: #ffffff; font-size: 23px; font-weight: bold;'>Economy Shoe Shop</span><br><span style='font-family: Verdana; color: #D4D4D4; font-size: 18px;'>Homemade Lasagna & House Salad only $9.00!</span> <hr height='1' width='100%'><span style='font-family: Verdana; color: #D4D4D4; font-size: 12px;'> Hungry? Stop by The Economy Shoe Shop for our "Feature Of The Day"! Only $9.00 all day long! Monday's Feature Of The Day: We<br><br>Mon, Jan 31, 2011 - 08:00</div> </center></td></tr> 
<!--end event--> 



    <tbody> 
    </table> 
    <!-- END Table for Events --> 
</td> 
<!-- 3-Next --> 
<td width='25' valign='middle' align='center'><div class='pagernext'>next link removed</div> </td> 
</tr> 
<tr valign="top"><td colspan="3" height="33" align='center'> 

<div class='pager'> 

<!-- bottom stuff to view events and profile more neatly this could be removed if <Div> code could be fixed see above --> 
View Profile&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
Click Here For More Detailsbr><br> 
<!-- End of bottom stuff to veiw events and profile more neatly--> 

<font color='#ffffff' size='5'> 
<span class='currentPage' ></span></font> 

<font color='#ffffff' size='2'>&nbsp;&nbsp;of&nbsp;&nbsp;</font> 
<font color='#ffffff' size='5'><span class='totalPages'></span></font> 


</div> 

</td></tr> 
<!-- END Main Body (middle) --> 
</table> 
+0

你得到了什麼JavaScript錯誤? (查看Safari的開發者控制檯。) – Phrogz 2011-01-31 16:57:01

回答

1

您的HTML非常糟糕。首先,然後再試一次。我試圖重現您的問題here,但看到Safari沒有問題。