jQuery JSON Hilfe

okay Ich bin neu in jQuery und JSON, aber ich habe es jetzt getan, ich habe einige Informationen aus der Datenbank im JSON-Format und jetzt möchte ich die Ergebnisse auf eine nette Weise zeigen, aber ich weiß nicht wie ;)jQuery JSON Hilfe

was ich möchte, ist 5 neueste threads auf meiner seite zu zeigen, also wird dieses script versuchen, die ganze zeit zu laden oder muss ich etwas anderes tun?

Ich möchte es die 5 neuesten Themen zeigen, und wenn es einen neuen Thread somes sollte ich nach unten rutschen und die 6 Fäden an der Unterseite sollte verschwinden

Hier ist mein Code

<script type="text/javascript"> 
$.getJSON('ajax/forumThreads', function(data) { 
    //$('<p>' + data[0].overskrift + '</p>').appendTo('#updateMe > .overskrift'); 

    $('<div class="overskrift">' + data[0].overskrift + '</div>') { 
     $(this).hide().appendTo('updateMe').slideDown(1000); 
    } 

    //alert(data[0].overskrift); 

}); 
</script>

Quelle

2011-01-06 kim

Hallo Kim, Willkommen in SO! Können Sie bitte Ihre Frage bearbeiten, es ist ein bisschen schwierig zu verstehen, was Sie erreichen wollen. – karim79

@ karim79: Ich denke, er will nur 5 Dinge zeigen, und wenn ein Fetch von der Datenquelle eine neuere Sache enthüllt, lege es an den Anfang der Liste, und schiebe das alte heraus. (Ajaxy immer-zeigen-die-neuesten-fünf-Dinge) – Thanatos

@ karim79 Entschuldigung für mein schlechtes Englisch, @ thanatos das ist, was ich tun will :) – kim

Was ist die Struktur Ihres serverseitigen Objekts? kann sagen, Ihr Server-Seite Objekt ist eine dieser (C#):

public class ForumThread 
{ 
    public string Title { get; set; } 
    public string Content { get; set; } 
    public string PostedBy { get; set; } 
}

dann Ihre Javascript-Funktion, jede Eigenschaft zugreifen würde wie folgt:

<script type="text/javascript"> 
    $.getJSON(
     'ajax/forumThreads', 
     function(data) { 
      alert(data.Title); 
      alert(data.Content); 
      alert(data.PostedBy); 
     } 
    }); 
</script>

Wenn Sie eine Liste der Elemente zurückkehren wollen, Sie könnten einen Behälter Antwortobjekt haben wie folgt:

public class ForumThreadList 
{ 
    public List<ForumThread> Threads { get; set; } 
}

..und Sie sich auf die Liste zugreifen, wie folgt:

<script type="text/javascript"> 
    $.getJSON(
     'ajax/forumThreads', 
     function(data) { 
       for (var i = 0; i < data.Threads.length; i++) { 
        alert(data.Threads[i].Title); 
        alert(data.Threads[i].Content); 
        alert(data.Threads[i].PostedBy); 
       } 
     } 
    }); 
</script>

Um ein neues Element hinzufügen, die Sie so etwas wie dies versuchen könnte:

Ihre HTML Unter der Annahme:

<body> 
    <div id="threadContainer"> 
     <!-- javascript will add divs like this: 
      <div class='threadItem'>Content!</div> 
     --> 
    </div> 
</body>

Ihr Javascript wie folgt sein könnte:

<script type="text/javascript"> 
    $.getJSON(
     'ajax/forumThreads', 
     function(data) { 
      for (var i = 0; i < data.Threads.length; i++) { 
       var threadItem = $("<div class='threadItem'>" + data.Threads[i].Title + "</div>"); 
       var existingItemCount = $("#threadContainer > .threadItem").length; 
       if (existingItemCount >= 5) { 
        $("#threadContainer > .threadItem:last").remove(); 
       } 
       if (existingItemCount == 0) { 
        $("#threadContainer").append(threadItem); 
       } 
       else { 
        threadItem.insertBefore($("#threadContainer > .threadItem:first")); 
       } 

      } 
     } 
    }); 
</script>

Quelle

2011-01-06 21:53:54 Robert

Ich habe das alles in Notepad ++ getan, also hoffentlich funktioniert alles. Probieren Sie es aus und lassen Sie mich wissen, wie Sie vorankommen. – Robert

jQuery JSON Hilfe

Antwort

Verwandte Themen