我有一个手风琴模块,有很多移动部件。简而言之,它从Google Fusion Table中提取数据并将其添加到手风琴的不同区域。这里可以看到一个工作的例子。 http://csgjusticecenter.org/code/SDWeb/accordionOld.html
无论出于何种原因,当我将其添加到我的WordPress网站并单击其中一个标题时,我在Chrome中收到错误消息“未捕获的TypeError:无法调用方法'appendChild'为null。”在FF中,我得到一个错误,说“TypeError:resourceCategories为null”。
此页面是如何在页面上无法使用的示例:http://csgjusticecenter.org/code/SDWeb/intranetAccordion.html。 如果我将手风琴放在iframe中(页面上的第二个例子),它就可以正常工作。
工作页面的代码(iframe的源代码)是:
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"> </script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" href='http://csgjusticecenter.org/code/SDWeb/resourceAccordion.css' />
<script src="http://csgjusticecenter.org/code/SDWeb/accordionResources.js"></script>
<script src="http://csgjusticecenter.org/code/SDWeb/resourceAccordion.js"> </script>
</head>
<body>
<script>buildPage();</script>
<div id="wrapper2"></div>
</body>
</html>
为什么手风琴在Wordpress网站上时会出现错误,而不是在单独添加时会出现错误?
非常感谢任何帮助。
编辑:
这是在单击类.accordionButton
的div时调用的函数。
function programResources(){
var query = "SELECT Category, Name, Website, Description FROM " +
'13aGTztEz7_XOWk7U_OzelJqr3Qr2yeFxv8ntt7FP ' + "WHERE 'Category' = '" + resourceName1 + "'";
var encodedQuery = encodeURIComponent(query);
// Construct the URL
var url = ['https://www.googleapis.com/fusiontables/v1/query'];
url.push('?sql=' + encodedQuery);
url.push('&key=AIzaSyD9Otr9A4pq624Ja9hRFMpUpBnyQAr06M0');
url.push('&callback=?');
// Send the JSONP request using jQuery
$.ajax({
url: url.join(''),
dataType: 'jsonp',
success: function (data) {
var rows = data['rows'];
var resourceCategories = document.getElementById(contentDivId);
var containerContainer = document.createElement('div');
containerContainer.className = 'containerContainer';
var infoContainer = document.createElement('div');
infoContainer.className = 'infoContainer';
infoContainer.innerHTML = 'Click resource title to learn more';
infoContainer.id = 'infoContainer';
for (var i in rows) {
var category = rows[i][0];
var resourceName2 = rows[i][1];
var siteUrl = rows[i][2];
var desc = rows[i][3];
var divID = rows[i][4];
var resourceName = document.createElement('div');
resourceName.className= 'resourceContainer';
resourceName.id = resourceName2 + 'resource';
var resourceText = document.createElement('span');
resourceText.className='resourceText';
resourceText.innerHTML = resourceName2;
resourceName.appendChild(resourceText);
containerContainer.appendChild(resourceName);
resourceCategories.appendChild(containerContainer);
resourceCategories.appendChild(infoContainer);
}
}
});
goScroll = 0;
};
错误出现在
之后 resourceCategories.appendChild(containerContainer);
此外,此功能(以及其他一些功能)包含在$(document).ready(function(){