我試圖根據JSON
輸出生成引導程序表。現在我需要在這些表格之後加載引導腳註。但有些表格不顯示頁腳。jQuery函數未正確加載引導程序頁腳
這裏是我的代碼
<script>
var data = [{
"UserID": 1,
"UserName": "rooter",
"Password": "12345",
"Country": "UK",
"Email": "[email protected]",
"sac": "[email protected]"
},
{
"UserID": 2,
"UserName": "binu",
"Password": "123",
"Country": "uk",
"Email": "[email protected]"
},
{
"UserID": 3,
"UserName": "cal",
"Password": "123",
"Country": "uk",
"Email": "[email protected]"
}
];
$(document).ready(function() {
var html = '<table class="table table-striped">';
html += '<tr>';
var flag = 0;
$.each(data[0], function(index, value) {
html += '<th>' + index + '</th>';
});
html += '</tr>';
$.each(data, function(index, value) {
html += '<tr>';
$.each(value, function(index2, value2) {
html += '<td>' + value2 + '</td>';
});
html += '<tr>';
});
html += '</table>';
//$('.table.table-striped').after(html);
// $('body').append(html);
$(html).insertAfter('.para');
});
$(document).ready(function() {
var html = '<table class="table table-striped">';
html += '<tr>';
var flag = 0;
$.each(data[0], function(index, value) {
html += '<th>' + index + '</th>';
});
html += '</tr>';
$.each(data, function(index, value) {
html += '<tr>';
$.each(value, function(index2, value2) {
html += '<td>' + value2 + '</td>';
});
html += '<tr>';
});
html += '</table>';
//$('.table.table-striped').after(html);
// $('body').append(html);
$(html).insertAfter('.para');
});
$(document).ready(function() {
var html = '<table class="table table-striped">';
html += '<tr>';
var flag = 0;
$.each(data[0], function(index, value) {
html += '<th>' + index + '</th>';
});
html += '</tr>';
$.each(data, function(index, value) {
html += '<tr>';
$.each(value, function(index2, value2) {
html += '<td>' + value2 + '</td>';
});
html += '<tr>';
});
html += '</table>';
// $('.table.table-striped').after(html);
$(html).insertAfter('.para');
});
</script>
頁腳
<footer>
<div class="container-fluid" style="background-color:#222;bottom:0; position:fixed;">
<div class="row">
<div class="col-sm-3">
<br>
<br>
<center><img class="icon" src="images/logo.png" alt="logo"></center>
</div>
<div class="col-sm-4" style="color:#e0e0e0;">
<h3 style="margin-top:10%;color:#42a5f5">ABOUT US.</h3>
<p>
Lorem Ipsum is simply dummy text of the Lorem Ipsum has been the industry's<br>
when an unknown printer took a galley of type and The following<br>
example shows how to<br><br>
get a three various-width columns <br>
make a type specimen book. It has survived not only <br>
but also the leap into electronic typesetting,<br>
</p>
</div>
<div class="col-sm-2">
<h3 style="margin-top:7%;color:#42a5f5"><br>NAVIGATION</h3>
<label style="color:#e0e0e0">
HOME
<hr>
</label>
<label style="color:#e0e0e0">
SITE
<hr>
</label>
<label style="color:#e0e0e0">
ABOUT US
<hr>
</label>
<label style="color:#e0e0e0">CONTACT US </label>
</div>
<div class="col-sm-3">
<h3 style="margin-top:4%;color:#42a5f5"><br>OUR LOCATION</h3>
<iframe frameborder="0" scrolling="no" width="250" height="200" src="https://maps.google.com/maps?hl=en&q=national school of business management,sri lanka&ie=UTF8&t=hybrid&z=15&iwloc=B&output=embed">
<div><small><a href="http://embedgooglemaps.com">
embedgooglemaps.com
embed google map
embed google maps
google maps karte erstellen
</a></small>
</div>
<div><small><a href="https://ultimatewebtraffic.com/">buy websit traffic Ultimatewebtraffic</a></small></div>
</iframe>
</div>
</div>
<hr>
<div class="row">
<div class="col-sm-10">
<p style="color:#29b6f6">Copyright © University 2016</p>
</div>
<div class="col-sm-2">
<i class="fa fa-facebook-square fa-1x" style="color:#42a5f5"></i>
<i class="fa fa-linkedin-square fa-1x" style="color:#42a5f5"></i>
<i class="fa fa-twitter-square fa-1x" style="color:#42a5f5"></i>
<i class="fa fa-google-plus fa-1x" style="color:#42a5f5"></i>
<i class="fa fa-delicious fa-1x" style="color:#42a5f5"></i>
</div>
</div>
</div>
</footer>
這裏是我的輸出結果
你的表溢出。 嘗試將它們放在class = row的div中,並對頁腳執行相同的操作。 –
@ElieNassif如果你能給我一個答案,因爲我很困惑這個 – Rooter
需要整頁的代碼不只是頁腳。 –