javascript 对象不支持属性或方法“dataTable”错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16284567/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示：将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间：2020-10-27 04:03:46 来源:igfitidea点击:
Object doesn't support property or method 'dataTable' error
提问by Pink Jazz
On my previous question, I have added the JQuery library and have fixed my style errors, however, I am now getting a new error: "Object doesn't support property or method 'dataTable'.
在我之前的问题中，我添加了 JQuery 库并修复了我的样式错误，但是，我现在收到一个新错误：“对象不支持属性或方法‘dataTable’。
Here is my updated HTML code:
这是我更新的 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>
And here is my JavaScript code, again:
这是我的 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);
}
Does anyone know what the problem is now?
有谁知道现在是什么问题？
回答by Developerzzz
You have no table in your html code
您的 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>
if you are using jquery data-table plugin the visit the following link for more information jquery datatable
如果您使用的是 jquery 数据表插件，请访问以下链接以获取更多信息jquery数据表
回答by BrianLegg
I'm having the same issue, but in your case it looks like you were using 'dataTable' instead of 'DataTable'. Let us know how you fixed the problem.
我遇到了同样的问题，但在您的情况下，您似乎使用的是“dataTable”而不是“DataTable”。让我们知道您是如何解决问题的。
