2013-04-29 385 views
0

在我以前的問題,我已經添加了JQuery庫,並已修復我的樣式錯誤,但是,我現在得到一個新的錯誤:「對象不支持屬性或方法 '的dataTable'對象不支持屬性或方法的'dataTable'錯誤

這是我更新的HTML代碼:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> 
<html> 
    <head> 
     <script type="text/javascript" src="/CensusDatabase/js/jquery-1.9.1.min.js"></script> 
     <script type="text/javascript" charset="utf-8" src="/CensusDatabase/js/jquery.dataTables-1.9.4.min.js"></script> 
     <script type="text/javascript" src="/CensusDatabase/js/DrawTable.js"></script> 
     <title>My Census Data</title> 
     <style type="text/css"> 
      body { 
       color: black; 
       background-color: #ffaacc; 
       font-family:"Trebuchet MS", "Calibri", sans-serif 
      } 
      h1 { 
       font-family:"Trebuchet MS", "Calibri", sans-serif 
      } 
     </style> 
    </head> 

    <body> 
     <h1>My Census Data</h1> 

     <div class="census"> 
      <div id="block-system-main"> 
       <h2>Reports</h2> 

       <ul> 
        <li><a href="#" onclick="nationalAgeGender()">National age and gender data</a> 
        </li> 
        <li><a href="#" onclick="arizonaAgeGender()">Arizona age and gender data</a> 
        </li> 
        <li><a href="#" onclick="combinedAgeGender()">Combined age and gender data</a> 
        </li> 
        <li><a href="#" onclick="nationalRace()">National race data</a> 
        </li> 
        <li><a href="#" onclick="arizonaRace()">Arizona race data</a> 
        </li> 
        <li><a href="#" onclick="combinedRace()">Combined race data</a> 
        </li> 
       </ul> 
       <div id="reportsData"><i>Please select a report to display.</i> 
       </div> 
      </div> 
     </div> 
    </body> 
</html> 

這裏是我的JavaScript代碼,再次:

function nationalAgeGender() { 
    (function ($) { 
     $('#data').html('<table width="100%" cellspacing="3" cellpadding="0" id="data-entry"></table>'); 
     $('#data-entry').dataTable({ 
      "bProcessing": true, 
      "bScrollInfinite": true, 
      "sScrollX": "160%", 
      "bScrollCollapse": true, 
      "bAutoWidth": false, 
      "sScrollY": "100%", 
      "iDisplayLength": -1, 
      "sDom": '<"top">rt<"bottom">', 
      "aaSorting": [], 
      "sAjaxSource": "/CensusDatabase/database_scripts/NationalAgeGender.php", 
      "aoColumns": [{ 
        "sTitle": "Age group" 
       }, { 
        "sTitle": "Total population (both genders)" 
       }, { 
        "sTitle": "Male population" 
       }, { 
        "sTitle": "Female population" 
       }, { 
        "sTitle": "% (both genders)" 
       }, { 
        "sTitle": "Male %" 
       }, { 
        "sTitle": "Female %" 
       } 
      ] 

     }); 
    })(jQuery); 
} 

function arizonaAgeGender() { 
    (function ($) { 
     $('#data').html('<table width="100%" cellspacing="3" cellpadding="0" id="data-entry"></table>'); 
     $('#data-entry').dataTable({ 
      "bProcessing": true, 
      "bScrollInfinite": true, 
      "sScrollX": "160%", 
      "bScrollCollapse": true, 
      "bAutoWidth": false, 
      "sScrollY": "100%", 
      "iDisplayLength": -1, 
      "sDom": '<"top">rt<"bottom">', 
      "aaSorting": [], 
      "sAjaxSource": "/CensusDatabase/database_scripts/ArizonaAgeGender.php", 
      "aoColumns": [{ 
        "sTitle": "Age group" 
       }, { 
        "sTitle": "Total population (both genders)" 
       }, { 
        "sTitle": "Male population" 
       }, { 
        "sTitle": "Female population" 
       }, { 
        "sTitle": "% (both genders)" 
       }, { 
        "sTitle": "Male %" 
       }, { 
        "sTitle": "Female %" 
       } 

      ] 

     }); 
    })(jQuery); 
} 

function combinedAgeGender() { 
    (function ($) { 
     $('#data').html('<table width="100%" cellspacing="3" cellpadding="0" id="data-entry"></table>'); 
     $('#data-entry').dataTable({ 
      "bProcessing": true, 
      "bScrollInfinite": true, 
      "sScrollX": "160%", 
      "bScrollCollapse": true, 
      "bAutoWidth": false, 
      "sScrollY": "100%", 
      "iDisplayLength": -1, 
      "sDom": '<"top">rt<"bottom">', 
      "aaSorting": [], 
      "sAjaxSource": "/CensusDatabase/database_scripts/CombinedAgeGender.php", 
      "aoColumns": [{ 
        "sTitle": "Age group" 
       }, { 
        "sTitle": "National total population (both genders)" 
       }, { 
        "sTitle": "National male population" 
       }, { 
        "sTitle": "National female population" 
       }, { 
        "sTitle": "National % (both genders)" 
       }, { 
        "sTitle": "National male %" 
       }, { 
        "sTitle": "National female %" 
       }, { 
        "sTitle": "Arizona total population (both genders)" 
       }, { 
        "sTitle": "Arizona male population" 
       }, { 
        "sTitle": "Arizona female population" 
       }, { 
        "sTitle": "Arizona % (both genders)" 
       }, { 
        "sTitle": "Arizona male %" 
       }, { 
        "sTitle": "Arizona female %" 
       } 
      ] 

     }); 
    })(jQuery); 
} 

function nationalRace() { 
    (function ($) { 
     $('#data').html('<table width="100%" cellspacing="3" cellpadding="0" id="data-entry"></table>'); 
     $('#data-entry').dataTable({ 
      "bProcessing": true, 
      "bScrollInfinite": true, 
      "sScrollX": "160%", 
      "bScrollCollapse": true, 
      "bAutoWidth": false, 
      "sScrollY": "100%", 
      "iDisplayLength": -1, 
      "sDom": '<"top">rt<"bottom">', 
      "aaSorting": [], 
      "sAjaxSource": "/CensusDatabase/database_scripts/NationalRace.php", 
      "aoColumns": [{ 
        "sTitle": "Category" 
       }, { 
        "sTitle": "White" 
       }, { 
        "sTitle": "White %" 
       }, { 
        "sTitle": "Black or African-American" 
       }, { 
        "sTitle": "Black or African-American %" 
       }, { 
        "sTitle": "Native American" 
       }, { 
        "sTitle": "Native American %" 
       }, { 
        "sTitle": "Asian" 
       }, { 
        "sTitle": "Asian %" 
       }, { 
        "sTitle": "Native Hawaiian or Pacific Islander" 
       }, { 
        "sTitle": "Native Hawaiian or Pacific Islander %" 
       }, { 
        "sTitle": "Some other race" 
       }, { 
        "sTitle": "Some other race %" 
       } 
      ] 

     }); 
    })(jQuery); 
} 

function arizonaRace() { 
    (function ($) { 
     $('#data').html('<table width="100%" cellspacing="3" cellpadding="0" id="data-entry"></table>'); 
     $('#data-entry').dataTable({ 
      "bProcessing": true, 
      "bScrollInfinite": true, 
      "sScrollX": "160%", 
      "bScrollCollapse": true, 
      "bAutoWidth": false, 
      "sScrollY": "100%", 
      "iDisplayLength": -1, 
      "sDom": '<"top">rt<"bottom">', 
      "aaSorting": [], 
      "sAjaxSource": "/CensusDatabase/database_scripts/ArizonaRace.php", 
      "aoColumns": [{ 
        "sTitle": "Category" 
       }, { 
        "sTitle": "White" 
       }, { 
        "sTitle": "White %" 
       }, { 
        "sTitle": "Black or African-American" 
       }, { 
        "sTitle": "Black or African-American %" 
       }, { 
        "sTitle": "Native American" 
       }, { 
        "sTitle": "Native American %" 
       }, { 
        "sTitle": "Asian" 
       }, { 
        "sTitle": "Asian %" 
       }, { 
        "sTitle": "Native Hawaiian or Pacific Islander" 
       }, { 
        "sTitle": "Native Hawaiian or Pacific Islander %" 
       }, { 
        "sTitle": "Some other race" 
       }, { 
        "sTitle": "Some other race %" 
       } 
      ] 

     }); 
    })(jQuery); 
} 

function combinedRace() { 
    (function ($) { 
     $('#data').html('<table width="100%" cellspacing="3" cellpadding="0" id="data-entry"></table>'); 
     $('#data-entry').dataTable({ 
      "bProcessing": true, 
      "bScrollInfinite": true, 
      "sScrollX": "160%", 
      "bScrollCollapse": true, 
      "bAutoWidth": false, 
      "sScrollY": "100%", 
      "iDisplayLength": -1, 
      "sDom": '<"top">rt<"bottom">', 
      "aaSorting": [], 
      "sAjaxSource": "/CensusDatabase/database_scripts/NationalRace.php", 
      "aoColumns": [{ 
        "sTitle": "Category" 
       }, { 
        "sTitle": "White (National)" 
       }, { 
        "sTitle": "White % (National)" 
       }, { 
        "sTitle": "Black or African-American (National)" 
       }, { 
        "sTitle": "Black or African-American % (National)" 
       }, { 
        "sTitle": "Native American (National)" 
       }, { 
        "sTitle": "Native American % (National)" 
       }, { 
        "sTitle": "Asian (National)" 
       }, { 
        "sTitle": "Asian % (National)" 
       }, { 
        "sTitle": "Native Hawaiian or Pacific Islander (National)" 
       }, { 
        "sTitle": "Native Hawaiian or Pacific Islander % (National)" 
       }, { 
        "sTitle": "Some other race (National)" 
       }, { 
        "sTitle": "Some other race % (National)" 
       }, , { 
        "sTitle": "White (Arizona)" 
       }, { 
        "sTitle": "White % (Arizona)" 
       }, { 
        "sTitle": "Black or African-American (Arizona)" 
       }, { 
        "sTitle": "Black or African-American % (Arizona)" 
       }, { 
        "sTitle": "Native American (Arizona)" 
       }, { 
        "sTitle": "Native American % (Arizona)" 
       }, { 
        "sTitle": "Asian (Arizona)" 
       }, { 
        "sTitle": "Asian % (Arizona)" 
       }, { 
        "sTitle": "Native Hawaiian or Pacific Islander (Arizona)" 
       }, { 
        "sTitle": "Native Hawaiian or Pacific Islander % (Arizona)" 
       }, { 
        "sTitle": "Some other race (Arizona)" 
       }, { 
        "sTitle": "Some other race % (Arizona)" 
       } 
      ] 

     }); 
    })(jQuery); 
} 

有誰知道問題是什麼,現在

+1

「CensusDatabase/js/jquery.dataTables-1.9.4.min.js」文件不存在? – Niels 2013-04-29 17:22:43

+0

好的,我只是將它更改爲jquery.dataTables.min.js。我不再收到錯誤,但DataTable不顯示。你碰巧知道發生了什麼? – 2013-04-29 17:25:38

+0

親愛的@Niels jquery.dataTables-1.9.4.min.js存在 – Developerzzz 2013-04-29 17:29:07

回答

4

您還沒有表在你的HTML代碼

   <table id="data-entry" class="display"> 
       <thead> 
        <tr> 
         <th>ID</th> 
         <th>Skill name</th> 
         <th>Sklill Leverl</th> 

        </tr> 
       </thead> 
       <tbody> 
       </tbody> 
      </table> 

,如果你使用jQuery數據表插件,請訪問以下鏈接瞭解更多信息 jquery datatable

+0

並嘗試谷歌jQuery數據表文件 – Developerzzz 2013-04-29 17:27:36

+0

謝謝。我想知道,標籤中的那些值是什麼意思?我的JavaScript文件將填充表格,所以我不知道這些值是否有意義。 – 2013-04-29 17:30:14

+0

@PinkJazz朋友這只是一個建議很抱歉 – Developerzzz 2013-04-29 17:33:36

1

我有同樣的問題,但在你的情況下,它看起來像你使用'dataTable'而不是'DataTable'。讓我們知道你是如何解決問題的。

相關問題