0

私はこのHTMLコードを持っています:

<tr class="gris">
    <td width="6%" class="titulo"><a href="{{ Here goes some URL}}"><img src="assets/play_icon.png" width="32" height="32" /></a></td>
    <td width="60%" class="titulo"><a href="{{ Here goes some URL }}">{{ Here goes some title }}</a> <span></br>Descripción de la Pista o Podcast</span></td>
    <td width="17%" class="fecha">{{ Here goes some date}}</td>
    <td width="17%" class="tiempo">{{ Here goes some time}}</td>
</tr>

そして、次のような JSON を返す PHP コードがあります。

{ "html_content" : [ { "description" : "Esta es una prueba de grabacion del podcast",
        "date" : "20130927",
        "hour" : "012100",
        "id" : "-317498614",
        "repro" : "0",
        "title" : "Prueba",
        "url" : "rtmp://46.4.158.7/kraa13/_definst_/kraa13/prueba1.flv"
      },
      { "description" : "260913",
        "date" : "20130926",
        "hour" : "192600",
        "id" : "-317498614",
        "repro" : "0",
        "title" : "260913",
        "url" : "rtmp://127.0.0.1/kraa13/_definst_/kraa13-317498614/260913.flv"
      }
    ],
  "response" : true
}

TRJSON にある値と同じ数を生成し、もちろん generated の正しい値を置き換えることができるはずTRです。たとえば、サンプル コードの反復ごとに、JSON 応答から{{ Here goes some URL }}の値を書き込む必要があります。url

アップデート

私はこのコードを試しました：

$(function() {
    window.setInterval(function() {
        var request = $.ajax({
            type: 'GET',
            url: "http://devserver/reader/podcast/podcast.php",
            success: function(data) {
                $("#podlist").html();
                if (data.response === false) {
                    $("#podlist").html(data.error);
                } else {
                    console.log(data.html_content);
                    if (data.html_content.length != 0) {
                        var htm = null;
                        for (var i in data.html_content) {
                            var jsonObj = data.html_content[i];
                            htm += "<tr class='gris'><td width='6%' class='titulo'><a href='" + jsonObj.url + "'><img src='assets/play_icon.png' width='32' height='32' /></a></td><td width='60%' class='titulo'><a href='" + jsonObj.url + "'>" + jsonObj.title + "</a> <span></br>" + jsonObj.description + "</span></td><td width='17%' class='fecha'>" + jsonObj.date + "</td><td width='17%' class='tiempo'>" + jsonObj.hour + "</td></tr>";
                        }
                        $("#podlist").append(htm);
                    }
                }
            },
            error: function() {
                request.abort();
            }
        });
    }, 5000);
});

しかし、私はこのエラーが発生しています:

TypeError: data.html_content is undefined
if (data.html_content.length != 0) {
4

6 に答える 6

1

AJAXを使用して動的に「JSON 結果から HTML コンテンツを更新する」ことについて話していることを期待して、次の解決策を思いつきました。AJAX の成功コールバックに次のコードを記述するだけです。

if(responseData.html_content.length != 0) {
  var htm = null;
  for(var i in responseData.html_content) {
      var jsonObj = responseData.html_content[i];
      htm += "<tr class='gris'><td width='6%' class='titulo'><a href='"+jsonObj.url+"'><img src='assets/play_icon.png' width='32' height='32' /></a></td><td width='60%' class='titulo'><a href='"+jsonObj.url+"'>"+jsonObj.title+"</a> <span></br>"+jsonObj.description+"</span></td><td width='17%' class='fecha'>"+jsonObj.date+"</td><td width='17%' class='tiempo'>"+jsonObj.hour+"</td></tr>";
  }
  $("#table-id").append(htm);
}

お役に立てれば！

于 2013-09-28T20:02:18.187 に答える
1

テーブル要素を取得して、内部 HTML をクリアしてから、応答 (リスト) の $.each ループで目的の行を追加することができます。「行」カウントが動的であり、非同期リクエストの後にのみそれを知っている場合、それはimoの最良のアプローチです。

于 2013-09-28T16:49:13.003 に答える
0

この形式に似ています。あなたはそれに少し取り組む必要がありました。:)

$.post('test.php', { id: id },
  function (page) {
    $('.titulo a' , myhtml).attr('href' , page.html_content..url);
    $('.conatiner').append(page.html_content.data);
}, 'json');

ここから答えを確認してください ..jsonからパラメータを取得するにはどうすればよいですか?

于 2013-09-28T17:14:53.880 に答える
0

ただ使う

var myhtml = '<tr class="gris"><td width="6%" class="titulo"><a href="{{ Here goes some URL}}"<img src="assets/play_icon.png" width="32" height="32" /></a></td><td width="60%" class="titulo"><a href="{{ Here goes some URL }}">{{ Here goes some title }</a><span></br>Descripción de la Pista o Podcast</span></td><td width="17%" class="fecha">{{ Here goes some date}}</td><td width="17%" class="tiempo">{{ Here goes some time}}</td></tr>';
$.each(the_data,function(i , v) {
    $('.titulo a' , myhtml).attr('href' , v.url);
    // and so on
    $('.conatiner').append(myhtml);
})
于 2013-09-28T16:48:45.973 に答える
0

簡単な解決策は、テンプレートを次のように維持することです

var template = '<tr class="gris">'+
    '<td width="6%" class="titulo"><a href="{{ Here goes some URL}}"><img src="assets/play_icon.png" width="32" height="32" /></a></td>'+
    '<td width="60%" class="titulo"><a href="{{ Here goes some URL }}">{{ Here goes some title }}</a> <span></br>Descripción de la Pista o Podcast</span></td>'+
    '<td width="17%" class="fecha">{{ Here goes some date}}</td>'+
    '<td width="17%" class="tiempo">{{ Here goes some time}}</td>'+
'</tr>';

var jstring = jQuery.parseJSON(jsonString);

var htmlContent = jstring.html_content;
var i=0;
var t =template;
for(;i<htmlContent.length;i++){
    t = t.replace("{{ Here goes some URL}}", htmlContent[i].url);   
    //Similarly  do for the other values...
    jQuery("table").append(jQuery(t));
    t=template;
}
于 2013-09-28T17:18:26.943 に答える
-2

やってみる

console.log(データ);

Ajax 呼び出しはデータを返しますか?

f12 をクリックしてブレークポイントを設定するか、選択したブラウザーで「ネット」パネルを使用して、Ajax 呼び出しで何が戻ってくるかを確認します。

于 2013-09-28T16:49:32.617 に答える