Javascript 将每个单击的帖子加载到页面中

我有以下代码，但我希望当我点击每个帖子时，帖子内容可以使用external.html或默认的html a div页面显示，这样内容就不会显示整个网站的内容：

HTML代码：

希望
每日祷告信息

JS代码：

$（文档）。在（“pagebeforeshow”上，“奉献页面”，函数（）{
$（this.find（“.ui listview筛选器输入”）.val（“”）.trigger（“更改”）；
});
$（文档）.ready（函数（）{
var url='1〕http://howtodeployit.com/category/daily-devotion/feed/?json=recentstories&callback=listPosts' ;
$.ajax({
键入：“获取”，
url:document.location.protocol+'//ajax.googleapis.com/ajax/services/feed/load？v=1.0&num=1000&callback=？&q='+encodeURIComponent（url），
数据类型：“json”，
错误：函数（）{
警报（“无法加载提要、路径不正确或提要无效”）；
},
成功：功能（数据）{
var postlist=data.responseData.feed.entries；
var html='
；
对于（变量i=0；i<6；i++）{
var条目=postlist[i]；
html+=“
”；
html+=''；
html+='
'；
}
html+='
'；
$（“#奉献列表”）.append（html）；
$（“#奉献列表ul[数据角色=列表视图]”）。列表视图（）；
}});
});

---

谢谢

我发现代码有一个问题。函数showarticle具有以下行

(html+='</ul>';) outside the ajax call's callback handler, but the variable html is declared inside it. So, actually the line 

html+='</ul>' is translated to undefined += '</ul>', which is not correct, unless you have var html; declared globally outside.

（html+='”；）在ajax调用的回调处理程序之外，但变量html在其内部声明。所以，事实上
html+=''被转换为未定义的+=''，这是不正确的，除非您有var html；对外宣布。

“要使用外部.html显示的帖子内容”

---

您可以对外部html进行ajax调用，内容类型为text/html，并将响应加载到div中。

恐怕我不应该发布完整的可行代码，因为这是为了帮助人们实现他们的解决方案，并为他们指明正确的方向。因此，我将只发布一段代码片段

$.ajax({
  url: your_server_side_script.extension, //example: handleInput.php
  dataType: 'text/html',
  data: {postid: $('#postid').val()},
  success: function(responseHTML) {
     $('#postContentDiv').html(responseHTML);
  }
});

---

您的\u server\u side\u script.extension（handleInput.php）应该生成html标记并打印出来，这样它就可以在ajax success中的responseHTML变量中使用。

我创建了一个函数来处理在不同页面上显示的每篇文章：

function showPost(id) {
$('#devotionlist').html("Please wait...");
$.getJSON('http://howtodeployit.com/?json=get_post&post_id=' + id + '&callback=?', function(data) {
    var output='';
    html += '<h3>' + data.post.title + '</h3>';
    html += data.post.content;
    $('#devotionlist').html(html);
}); //get JSON Data for Stories
} //showPost

功能显示柱（id）{
$（“#奉献列表”）.html（“请稍候…”）；
$.getJSON（'http://howtodeployit.com/?json=get_post&post_id=“+id+”&回调=？”，函数（数据）{
var输出=“”；
html+=''+data.post.title+''；
html+=data.post.content；
$（'#奉献列表'）.html（html）；
})；//获取故事的JSON数据
}//展示台

此位调用onClick函数：

html += '<a href="#articlecontent" onclick="showPost(' + val.id + ')">';

html+=''；

Hi Rajesh我已经重新表述了我的问题，以便每个人都能理解。你想在不同的页面上显示结果吗？是的@Omar，我的目的是在单独的页面上显示每个帖子的内容。为了让其他人学习和理解，你能给我一个可行的代码来实现这一点吗。我们已经在meta上详细讨论了ThanksIt。官方鼓励您给出完整的答案。感谢AlKid提供此有用的更新。这个网站是关于互相帮助和即将到来的程序员