0

これは私のjqueryコードです

$("document").ready(function() {
        $.getJSON("http://bluewingholidays.com/results.json", function(data) {
            $("#div-my-table").text("<table>");
            $.each(data, function(i, item) {
                $("#div-my-table").append("<tr><td>" + item.EncoderName + "</td><td>" + item.EncoderStatus + "</td></tr>");
            });
            $("#div-my-table").append("</table>");
        });
    });

HTMLテーブルを使用してWebにデータを表示したい

<table id="div-my-table">
    <tr><td></td></tr>
     <tr><td></td></tr>
     <tr><td></td></tr>
</table>

しかし、何も起こりませんでしたか？

4

4 に答える 4

3

すぐにわかる問題の 1 つは、に変更する必要があること$("document")です$(document)。セレクターではなくドキュメント オブジェクトを渡したい。

$(document).ready(function(){...
于 2012-12-10T19:13:02.597 に答える
1

append</table>jQueryに任意のテキストを追加しません（特に追加しません）。それは要素を追加します...あなたはむしろそのようなコードを使うべきです：

// Content will contain the HTML code of your new table
var content = "";

$.each(data, function(i, item) {
    content += "<tr><td>" + item.EncoderName + "</td><td>" + item.EncoderStatus + "</td></tr>";
});   

// Set the HTML of your table to this new content
$("#div-my-table").html(content);
于 2012-12-10T19:21:43.323 に答える
1

ここにはさまざまな問題がたくさんあります。

まず、$("document").ready(する必要があります$(document).ready(。引用符を失います。documentセレクターではなく、オブジェクトを渡したい。

次に、このコードが で実行されていない場合、このコードは機能しませんbluewingholidays.com。これは、同一オリジン ポリシーと呼ばれます。

3 つ目は、jQuery で要素を追加する方法ではありません。(注:.text要素のテキストを変更するためのものです。HTML を送信すると、エスケープされます。)

jQuery で HTML を追加する場合、最初に開始タグを追加してから終了タグを追加するのではありません。jQuery は、フラグメントではなく、完全な HTML を送信することを想定しています。

$(document).ready(function() {
    // This will only work if this code is on bluewingholidays.com
    $.getJSON("http://bluewingholidays.com/results.json", function(data) {
        $("#div-my-table").empty(); // this is already a table, so let's empty it
        $.each(data, function(i, item) {
            // You're appending HTML elements to other HTML elements
            // You are not appending text in the way you think
            $("#div-my-table").append("<tr><td>" + item.EncoderName + "</td><td>" + item.EncoderStatus + "</td></tr>");
        });
        // You append HTML elements, not strings, so you don't need this line
        //$("#div-my-table").append("</table>");
    });
});
于 2012-12-10T19:31:34.437 に答える
0

私はあなたのテーブルがすでに存在すると仮定しているので、これはうまくいくはずです:

<table id="div-my-table">    </table>

スクリプトで、返された JSON を処理します。

$.each(data.Properties, function(i, item) {
    $("#div-my-table").append("<tr><td>" + item.id + ":" + item.title +  "</td><td>" + item.price + "</td></tr>");
});
于 2012-12-10T20:12:50.543 に答える