頁腳沒有顯示Jquery函數後

我使用此代碼生成引導面板使用JSON，它的工作正常。但現在我需要在此面板後顯示頁腳。但是在這個函數之後頁腳不會被加載。這個jQuery函數不僅僅是頁腳，其他HTML內容也不會顯示。爲什麼以及如何解決它？頁腳沒有顯示Jquery函數後

var valMS = [ 
    { 
    "Subject": "Test", 
    "Message": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.", 
    "Date": "12-03-17" 
    }, 
    { 
    "Subject": "Test", 
    "Message": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.", 
    "Date": "12-03-17" 
    }, 
    { 
    "Subject": "Test", 
    "Message": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.", 
    "Date": "12-03-17" 
    }, 
    { 
    "Subject": "Test", 
    "Message": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.", 
    "Date": "12-03-17" 
    } 
]; 

$(document).ready(function() { 
    html = '<div class="container" >'; 
    // var flag = 0; 

    $.each(valMS, function(index, v){ 
     html += '<div id="events" class="container"><div class="row">'; 
     html += '<div class="panel panel-primary" style="width: 20%;" >'; 
     html += '<div class="panel-heading">'+v["Subject"]+'</div>'; 
     html += '<div class="panel-body">'+v["Message"]+'</div>'; 
     html += '<div class="panel-footer">'+v["Date"]+'</div>'; 
     html += '</div>'; 
     html += '</div></div>'; 
    }); 

    $('body').append(html); 
    //$(".container").after($("<p>Test</p>")); 
}); 

</script>

來源

2017-04-10 Rooter

什麼頁腳？你所顯示的是javascript。我們不知道頁面中有什麼或者用什麼css。請參閱[mcve] – charlietfl

您的'js'中出現了某些錯誤。請檢查您的瀏覽器控制檯。 –

檢查您的瀏覽器控制檯。 –

您要關閉循環中的<div>！試試這個：

html = '<div class="container" >'; 
$.each(valMS, function(index, v){ 
    html += '<div id="events" class="container"><div class="row">'; 
    html += ' <div class="panel panel-primary" style="width: 20%;" >'; 
    html += ' <div class="panel-heading">'+v["Subject"]+'</div>'; 
    html += ' <div class="panel-body">'+v["Message"]+'</div>'; 
    html += ' <div class="panel-footer">'+v["Date"]+'</div>'; 
    html += ' </div>'; 
    html += '</div>'; 
}); 
html += '</div>'; 
$('body').append(html);

來源

2017-04-10 17:24:49 miken32

謝謝。你的回答對我有幫助。請檢查我更新的問題。表生成函數的錯誤是什麼。在那之後我也面臨同樣的問題。頁腳不顯示。 – Rooter

如果有任何答案是有幫助的，請將它們加註。如果這個人回答了你的問題，請將其標記爲已接受。如果您有*另一個問題，請點擊主頁上的「問題問題」按鈕。 – miken32

好吧，我完成了你說的:)這是我的新問題。我認爲提問有一些限制。對不起http://stackoverflow.com/questions/43331403/page-content-not-showing-after-jquery功能 – Rooter

好的，這樣嗎？只是與編號

<!DOCTYPE html> 
<html> 

<head> 

    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 


    <title>test</title> 

    <!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 


<style> 

</style> 

</head> 

<body> 








<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> 

<script> 

var valMS = [ 
    { 
    "Subject": "Test", 
    "Message": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.", 
    "Date": "12-03-17" 
    }, 
    { 
    "Subject": "Test", 
    "Message": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.", 
    "Date": "12-03-17" 
    }, 
    { 
    "Subject": "Test", 
    "Message": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.", 
    "Date": "12-03-17" 
    }, 
    { 
    "Subject": "Test", 
    "Message": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.", 
    "Date": "12-03-17" 
    } 
]; 

$(document).ready(function() { 
    html = '<div class="container" id="mypanel">'; 
    // var flag = 0; 

    $.each(valMS, function(index, v){ 
     html += '<div id="events" class="container"><div class="row">'; 
     html += '<div class="panel panel-primary" style="width: 20%;" >'; 
     html += '<div class="panel-heading">'+v["Subject"]+'</div>'; 
     html += '<div class="panel-body">'+v["Message"]+'</div>'; 
     html += '<div class="panel-footer">'+v["Date"]+'</div>'; 
     html += '</div>'; 
     html += '</div></div>'; 
    }); 

    $('body').append(html); 
    $("#mypanel").after($('<div class="footer"><div class="container"<p>This is a footer</p></div></div>')); 
}); 

</script> 



</body> 

</html>

來源

2017-04-10 18:54:45

頁腳沒有顯示Jquery函數後

回答

相關問題