我正在使用javascript从JSON构建页面。我正在尝试按照OOJS来构建页面。
我如何获得JSON：我使用RESTful api来获取JSON。
一旦我获得JSON，我使用jquery将其转换为json对象，然后使用OOJS对象将它们转换为页面内容。
我正在左侧加载facet并在右侧加载结果。当我点击左侧的链接时，整个页面应该刷新。我正在使用结果和构面对象来创建页面。
现在我在调用loadPage（callbackurl）时遇到问题。我收到了JS错误
Uncaught TypeError: object is not a function
已附上以下文件。任何意见将是有益的。提前致谢
HTML页面：
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="assets/css/faceted-search.css" rel="stylesheet" />
<script src="js/mcu.json"></script>
<script src="js/facets.js"></script>
<script src="js/results.js"></script>
<script src="js/tags.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
function getUrlVars()
{
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++)
{
hash = hashes[i].split('=');
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
}
</script>
<script>
// Get the values from the query string
var results;
var facets;
function loadPage(callbackurl){
var query = getUrlVars()["query"];
$("#hidecontent").load(callbackurl, function(response, status, xhr){
query = query.replace("%20", " ");
$('input#inputsearch').val(query);
//var mcu = response;
jsonObj = $.parseJSON(response);
results = new results(jsonObj);
results.createResults("results");
$('div#facets').find('div.content').find('div.topDiv').find('div').find('a').click(function(e){
console.log(e);
var facetsDiv = $('div#facets').find('div.content');
var querystring = 'rest/nxp-facetSearch?query=' + $('input#inputsearch').val() + '&facet=' + $(this).parent().parent().parent().attr('id')+ "~" + $(this).attr('id') ;
loadPage(querystring);
$.each(facetsDiv, function(){
// If length of the selector > 0 then true else false
var selectedfacetvalues = $(this).find('a.selected');
var selectedstring = "";
if(selectedfacetvalues.length){
$.each(selectedfacetvalues, function(){
selectedstring = selectedstring + $(this).attr('id') + ",";
});
querystring = querystring + $(this).attr('id') + "~" + selectedstring.slice(0, -1) + ";";
}
});
console.log(querystring);
});
});
}
</script>
</head>
<body>
<div id="hidecontent" style="display: none">
</div>
<div id="topheader">
<img src="images/NXP_logo.png" />
</div>
<div id="framecontent">
<div id="facets" class="innertube">
<div>
</div>
</div>
</div>
<div id="searchbox">
<input id="inputsearch" type="text" value="" size="40" /> <img class="searchimg" src="images/Search.png" style="cursor: pointer" />
</div>
<!--div id="tags">
</div-->
<div id="maincontent">
<p> </p>
<div id="results">
</div>
</div>
<script>
var query = getUrlVars()["query"];
callbackurl = "rest/nxp-facetSearch?query=" + query + "";
loadPage(callbackurl);
</script>
</body>
</html>
JSON文件：
如果我还需要附加json文件，请告诉我。
Result.js：
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
var localObject;
function results(){
}
function results(jsonObject){
localObject = jsonObject;
}
results.prototype.createResults = function(targetID){
resultsDiv = document.getElementById(targetID);
resultsDiv.innerHTML = "";
container = document.createElement("div");
container.setAttribute("id", "container");
resultsDiv.appendChild(container);
var values = localObject.results;
if(values.length > 0){
results.createTable(resultsDiv, values);
}else{
var noresults = document.createElement("span");
noresults.innerHTML = "No results found!";
resultsDiv.appendChild(noresults);
}
}
results.prototype.createTable = function(resultsDiv, values){
var topdiv = document.createElement("div");
//table.setAttribute("class", "products");
for (var v in values)
{
var div = document.createElement("div");
var span = document.createElement("span");
var p = document.createElement("p");
span.setAttribute("class", values[v].type);
div.setAttribute("class", "column");
p.setAttribute("class", "resultcolumnvalue");
p.innerHTML = values[v].value ;
div.appendChild(span);
div.appendChild(p);
topdiv.appendChild(div);
}
resultsDiv.appendChild(topdiv);
}