2009-07-21 49 views
0

我們發現了一個名爲FixedTable的JQuery插件,用於將滾動條添加到HTML表格中,並將他們的示例代碼(請參見下文)從其網站複製到ASP.Net Web窗體中。每個代碼執行它時炸燬線12,$(「 tableDiv」)。每個(函數(),說對象預期。任何人都知道什麼是錯的代碼?JQuery固定表

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="fixedtable.aspx.cs"  Inherits="_Default" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org /TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="~/js/jquery-1.3.2-vsdoc2.js"></script> 
    <script type="text/javascript" src="~/js/jquery.fixedtable.js"></script> 
<script type="text/javascript"> 
    // this "tableDiv" must be the table's class 
    $(".tableDiv").each(function() { 
     var Id = $(this).get(0).id; 
     var maintbheight = 555; 
     var maintbwidth = 911; 

     $("#" + Id + " .FixedTables").fixedTable({ 
      width: maintbwidth, 
      height: maintbheight, 
      fixedColumns: 1, 
      // header style 
      classHeader: "fixedHead", 
      // footer style   
      classFooter: "fixedFoot", 
      // fixed column on the left   
      classColumn: "fixedColumn", 
      // the width of fixed column on the left  
      fixedColumnWidth: 150, 
      // table's parent div's id   
      outerId: Id, 
      // tds' in content area default background color      
      Contentbackcolor: "#FFFFFF", 
      // tds' in content area background color while hover.  
      Contenthovercolor: "#99CCFF", 
      // tds' in fixed column default background color 
      fixedColumnbackcolor: "#187BAF", 
      // tds' in fixed column background color while hover. 
      fixedColumnhovercolor: "#99CCFF" 
     }); 
    }); 
</script> 
<style type="text/css"> 
    body 
    { 
     width: 900px; 
    } 
    p 
    { 
     float:left; 
     width: 100%; 
     margin: 20px 0px; 
    } 
    .fixedColumn .fixedTable td 
    { 
     color: #FFFFFF; 
     background-color: #187BAF; 
     font-size: 12px; 
     font-weight: normal; 
    } 

    .fixedHead td, .fixedFoot td 
    { 
     color: #FFFFFF; 
     background-color: #187BAF; 
     font-size: 12px; 
     font-weight: normal; 
     padding: 5px; 
     border: 1px solid #187BAF; 
    } 
    .fixedTable td 
    { 
     font-size: 8.5pt; 
     background-color: #FFFFFF; 
     padding: 5px; 
     text-align: left; 
     border: 1px solid #CEE7FF; 
    } 
    .tableDiv 
    { 

    } 
</style> 


</head> 
<body> 
    <form id="form1" runat="server"> 
    <div id="tableDiv_Arrays" class="tableDiv"> 
    <table id="Open_Text_Arrays" class="FixedTables"> 
     <thead> 
      <tr> 
       <th> 
        Purpose 
       </th> 
       <th> 
        C# 
       </th> 
       <th> 
        Php4 
       <th> 
       <th> 
        Php5 
       </th> 
       <th> 
        ActionScript 
       </th> 
       <th> 
        JavaScript 
       </th> 
       <th> 
        Ruby 
       </th> 
      </tr> 
     <thead> 
     <tbody> 
      <tr> 
       <th> 
        data1 
       </th> 
       <th> 
        data2 
       </th> 
       <th> 
        data3 
       <th> 
       <th> 
        data4 
       </th> 
       <th> 
        data5 
       </th> 
       <th> 
        data6 
       </th> 
       <th> 
        data7 
       </th> 
      </tr> 
     </tbody> 
     <tfoot> 
      <tr> 
       <th> 
        Purpose 
       </th> 
       <th> 
        C# 
       </th> 
       <th> 
        Php4 
       <th> 
       <th> 
        Php5 
       </th> 
       <th> 
        ActionScript 
       </th> 
       <th> 
        JavaScript 
       </th> 
       <th> 
        Ruby 
       </th> 
      </tr> 
     </tfoot> 
    </table> 
</div> 

</form> 
</body> 
</html> 

回答

0

爲了在那裏得到'對象預期'的錯誤,jQuery一定不會被加載,腳本標記中的src="~/js/jquery-1.3.2-vsdoc2.js"屬性是什麼,並帶有波浪號?是你的web服務器會理解的東西,還是它看起來像是錯誤的?總之,在一些時尚,你的腳本標籤不是指你的jQuery源文件在一個可行的辦法。

而且,當你得到的排序中,tableDiv不存在當腳本內容運行時。您需要將腳本放入$(document).ready()

+0

但是這不應該導致js錯誤。 – redsquare 2009-07-21 19:38:24

+0

IE的方式是神祕而可怕的,但你可能是對的。 「期望的對象」聽起來像jQuery甚至沒有加載。得說,我真的懷疑腳本src屬性中的這些tildes值;我認爲他們是OP的環境可以理解的東西,但也許不是。 – chaos 2009-07-21 19:45:46

+0

代字號確實是一個問題,我刪除了那些並檢查了螢火蟲,以確保jquery文件正確加載,他們現在,我添加了document.ready()函數。我現在得到一張表,沒有錯誤消息,但沒有滾動條。任何其他想法? – 2009-07-21 20:13:48

0

你確定jQuery被正確請求嗎? 你可以在Firefox中使用fiddler2或firebug進行檢查。

此外,您將需要文檔準備功能。這可確保在開始操作之前,dom已準備就緒。

$(function(){ 

    $(".tableDiv").each(function() { 
     var Id = $(this).get(0).id; 
     var maintbheight = 555; 
     var maintbwidth = 911; 

     $("#" + Id + " .FixedTables").fixedTable({ 
      width: maintbwidth, 
      height: maintbheight, 
      fixedColumns: 1, 
      // header style 
      classHeader: "fixedHead", 
      // footer style   
      classFooter: "fixedFoot", 
      // fixed column on the left   
      classColumn: "fixedColumn", 
      // the width of fixed column on the left  
      fixedColumnWidth: 150, 
      // table's parent div's id   
      outerId: Id, 
      // tds' in content area default background color      
      Contentbackcolor: "#FFFFFF", 
      // tds' in content area background color while hover.  
      Contenthovercolor: "#99CCFF", 
      // tds' in fixed column default background color 
      fixedColumnbackcolor: "#187BAF", 
      // tds' in fixed column background color while hover. 
      fixedColumnhovercolor: "#99CCFF" 
     }); 
    }); 

};

0

或者將腳本塊放在文件末尾的</body></html>標記之間。