17 Stimmen

Nicht registrierter Benutzer avatar

Beste Möglichkeit zur Anzeige von Daten über JSON mit jQuery

Gefragt el 29 de November, 2008
Wann wurde die Frage gestellt
105935 Ansichten
Anzahl der Besuche der Frage
4 Antworten
Anzahl der Fragenantworten
Gelöst
Aktueller Status der Frage

Ich versuche, den besten Weg zu finden, um Ergebnisse auf meiner Seite über einen Ajax-Aufruf mit jQuery anzuzeigen, denken Sie, dass der beste Weg ist, es als JSON oder reinen Text zu übergeben? Ich habe mit Ajax-Aufrufe vor gearbeitet, aber nicht sicher, welche über die andere und für die JSON-Version bevorzugt wird, was ist der beste Weg, um aus einer JSON-Datei von einer PHP-Seite generiert, um meine Ergebnisse anzuzeigen lesen.

Ich weiß, ich würde eine .each durchlaufen, um sie alle anzuzeigen.

Gefragt el 29 de November, 2008 von Nicht registrierter Benutzer

Antworten

Zu viele Anzeigen?

27voto

Jay avatar
Jay Punkte 833

Etwa so:

$.getJSON("http://mywebsite.com/json/get.php?cid=15",
        function(data){
          $.each(data.products, function(i,product){
            content = '<p>' + product.product_title + '</p>';
            content += '<p>' + product.product_short_description + '</p>';
            content += '<img src="' + product.product_thumbnail_src + '"/>';
            content += '<br/>';
            $(content).appendTo("#product_list");
          });
        });

Würde ein json-Objekt nehmen, das aus einem PHP-Array mit dem Schlüssel products zurückgegeben wird. z.B:

Array('products' => Array(0 => Array('product_title' => 'Product 1',
                                     'product_short_description' => 'Product 1 is a useful product',
                                     'product_thumbnail_src' => '/images/15/1.jpg'
                                    )
                          1 => Array('product_title' => 'Product 2',
                                     'product_short_description' => 'Product 2 is a not so useful product',
                                     'product_thumbnail_src' => '/images/15/2.jpg'
                                    )
                         )
     )

Um die Liste neu zu laden, machen Sie einfach Folgendes:

$("#product_list").empty();

Und dann rufen Sie getJSON erneut mit neuen Parametern auf.

Beantwortet el 29 de November, 2008 von Jay (833 Punkte )

11voto

braindead avatar
braindead Punkte 171

JQuery hat einen eingebauten json-Datentyp für Ajax und wandelt die Daten in ein Objekt um. PHP% hat auch eine eingebaute json_encode Funktion, die ein Array in einen json formatierten String umwandelt. Spart eine Menge Parsing, Dekodierung Aufwand.

Beantwortet el 29 de November, 2008 von braindead (171 Punkte )

4voto

Nicht registrierter Benutzer avatar
Nicht registrierter Benutzer Punkte 0

Perfekt! Danke Jay, unten ist mein HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Facebook like ajax post - jQuery - ryancoughlin.com</title>
<link rel="stylesheet" href="../css/screen.css" type="text/css" media="screen, projection" />
<link rel="stylesheet" href="../css/print.css" type="text/css" media="print" />
<!--[if IE]><link rel="stylesheet" href="../css/ie.css" type="text/css" media="screen, projection"><![endif]-->
<link href="../css/highlight.css" rel="stylesheet" type="text/css" media="screen" />
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
/* <![CDATA[ */
$(document).ready(function(){
    $.getJSON("readJSON.php",function(data){
        $.each(data.post, function(i,post){
            content += '<p>' + post.post_author + '</p>';
            content += '<p>' + post.post_content + '</p>';
            content += '<p' + post.date + '</p>';
            content += '<br/>';
            $(content).appendTo("#posts");
        });
    });   
});
/* ]]> */
</script>
</head>
<body>
        <div class="container">
                <div class="span-24">
                       <h2>Check out the following posts:</h2>
                        <div id="posts">
                        </di>
                </div>
        </div>
</body>
</html>

Und meine JSON-Ausgaben:

{ posts: [{"id":"1","date_added":"0001-02-22 00:00:00","post_content":"This is a post","author":"Ryan Coughlin"}]}

Ich erhalte diesen Fehler, wenn ich meinen Code ausführe:

object is undefined
http://localhost:8888/rks/post/js/jquery.js
Line 19
Beantwortet el 29 de November, 2008 von Nicht registrierter Benutzer (0 Punkte )

3voto

strager avatar
strager Punkte 86191

Sie können ein jQuery-Objekt aus einem JSON-Objekt erstellen:

$.getJSON(url, data, function(json) {
    $(json).each(function() {
        /* YOUR CODE HERE */
    });
});
Beantwortet el 29 de November, 2008 von strager (86191 Punkte )

Verwandte Fragen

Empfohlene Fragen

Top-Tags

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

Yandex
X