AJAX显示/隐藏内容

Question

before anyone complains ive tried google but there isnt a straight forward answer or tutorial of any sort..

Basically ive got articles where a paragraph is seen then a *read more" link which using some javascript it shows more content, although eventually this will slow down the website as the rest of the article is there but just hidden.

So my question is how would i set up a AJAX/PHP to bring in the content instead? i know how to set up a database on mysql and am i right in guessing i would need to type out the article in MySQL when storing it in there? sorry if everything im saying is confusing but im confused myself... if anyone could explain for an absolute beginner that would be great as google just isn't my friend even after hours of searching.

Think ive been misunderstood. The above screenshot ive already achieved but what im wanting to do now is instead of hiding content then displaying it on-click to have it being called in using AJAX, a database and php

Answer 1

1. Add a "PreviewCutoffIndex" or similar to the articles table.
2. On page load, display the article HTML / content up to the cutoff index.
3. For the "read more" button, put the article identifier into an attribute
4. Add a click handler that makes an Ajax call, to load the rest of the article

---

Markup would look something like this ("data-article-id" comes from PHP on the page load):

<div>
    <?php echo $mysqlResult["articleContent"]; ?>
</div>
<a id="moreButton" data-article-id="<?php echo $articleId; ?>" href='#'>Read More</div>
<div id="moreContent"></div>

Javascript (assume you're going to use JQuery):

$("#moreButton").on("click", function(e) {
    e.preventDefault();
    var articleId = $(this).attr("data-article-id");

    // load article into "moreContent" div
    $("#moreContent").load("content.php?articleId=" + articleId);
});

Then the PHP content.php should return text (or more likely markup) for the remainder of the article, based on $_GET("articleId").