我有'index.html'和'table.html',点击'index.html'中的'click here'我需要重定向到'table.html'并调用相应的json,但这里重定向正在发生并且数据未加载来自'members.json'我添加了所有文件,下面是我的代码。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="js/script.js"></script>
<style>
</style>
</head>
<body>
<div id="div">
click here
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="js/script.js"></script>
<style>
</style>
</head>
<body>
<div class="col-md-12">
</div>
<div id="div">
<div>
<table id="example">
<thead>
<tr>
<th>name</th>
<th>stargazerscount</th>
<th>forkscount</th>
<th>description</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<script type="text/javascript" charset="utf8" src="js/script.js"></script>
</div>
</div>
$( document ).ready(function() {
$('#div').click(function()
{
$('#example').DataTable( {
language: {
searchPlaceholder: "Search records"
},
"ajax": {
"type" : "POST",
"url": "http://localhost/js/members.json",
"dataSrc": function (json) {
var return_data = new Array();
for(var i=0;i< json.length; i++){
return_data.push({
'name': json[i].name,
'stargazerscount' : '<span onclick="f()">'+json[i].stargazerscount+'</span>',
'forkscount' : json[i].forkscount,
'description' : json[i].description
})
}
return return_data;
}
},
"columns": [
{ "data": "name" },
{ "data": "stargazerscount" },
{ "data": "forkscount" },
{ "data": "description" }
]
});
window.location = 'table.html'
}
);
});
[{
"name": "mango",
"stargazerscount": 526,
"forkscount": "critical",
"description": "fruits"
},
{
"name": "brinjal",
"stargazerscount": 526,
"forkscount": "critical",
"description": "vagetables"
},
{
"name": "grapes",
"stargazerscount": 526,
"forkscount": "major",
"description": "fruits"
},
{
"name": "soap",
"stargazerscount": 526,
"forkscount": "major",
"description": "groceries"
},
{
"name": "dates",
"stargazerscount": 526,
"forkscount": "critical",
"description": "dryfruits"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "shirt",
"stargazerscount": 526,
"forkscount": "critical",
"description": "clothes"
},
{
"name": "dates",
"stargazerscount": 526,
"forkscount": "critical",
"description": "dryfruits"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "shirt",
"stargazerscount": 526,
"forkscount": "critical",
"description": "clothes"
},
{
"name": "shirt",
"stargazerscount": 526,
"forkscount": "critical",
"description": "clothes"
},
{
"name": "dates",
"stargazerscount": 526,
"forkscount": "critical",
"description": "dryfruits"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "shirt",
"stargazerscount": 526,
"forkscount": "critical",
"description": "clothes"
},
{
"name": "dates",
"stargazerscount": 526,
"forkscount": "critical",
"description": "dryfruits"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "mobiles",
"stargazerscount": 526,
"forkscount": "major",
"description": "electronics"
},
{
"name": "shirt",
"stargazerscount": 526,
"forkscount": "critical",
"description": "clothes"
}
]