2011-01-31 7 views
1

이 스크립트는 Safoor 5가 아닌 IE & FF에서 정상적으로 작동합니다. 초기화되지 않은 것처럼 보입니다 (즉, 아무 것도 작동하지 않는 것 같습니다). 스크립트는 한 번에 테이블의 한 행을 표시하여 다음 또는 이전이 클릭 될 때까지 다른 행을 숨 깁니다. 원본은 halifaxhype.com에서 볼 수 있습니다. 누군가가 제안을 할 수 있다면 자바 스크립트 나 Jquery 나 Safari로 일반적으로 작업하지 않기 때문에 고맙겠습니다.Jquery javascript가 Safari 5에서 작동하지 않습니다.

JS - (인해 제한 앵커 링크 및 이미지 링크되는 HTML 제거 게시 자바 스크립트 아래 HTML 하였다) -

$(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

어떤 자바 스크립트 오류가 발생합니까? (Safari의 개발자 콘솔을보십시오.) – Phrogz

+1

이렇게 큰 샘플을 보려면 코드를 [JSFiddle] (http://jsfiddle.net/)에 붙여 넣으십시오. (JSFiddle에서 작업 한 후에는 저장을 클릭 한 다음 URL을 붙여 넣으십시오.) – josh3736

+1

HTML을 작성한 사람은 누구나 http://phrogz.net/CSS/HowToDevelopWithCSS.html을 읽고 개발을 중단해야합니다. 1998 년 기준. 그것은 내가 최근에 보아온 HTML과 혼합 된 최악의 경우에 관한 것입니다. – Phrogz

답변

1

HTML이 매우 손상되었습니다. Validate your HTML 먼저 시도한 다음 다시 시도하십시오. 문제점 here을 재현하려고 시도했지만 Safari에는 문제가 없습니다.

관련 문제