2016-11-27 17 views
0

画像付きのテーブルを追加しようとしています。しかし何らかの理由でそれを表示していません。何が原因でしょうか?Firebaseの画像を添付したテーブル

これはjqueryです:それはCSSセレクタとして扱われますよう

$(document).ready(function() { 
    var brandsRef = firebase.database().ref().child("Snuses"); 
    brandsRef.on("child_added", snap=> { 
     var productImageUrl = snap.child("productUrl").val(); //This is the image src 
     var brandName = snap.child("Brand").val(); 
     var product = snap.child("Products").val(); 
     var nicotine = snap.child("nicotine").val(); 

     $("#tableBody").append("<tr>" 
      + "<td>"+$("img").attr("src", productImageUrl);+"</td>" //Is this right way to do it? 
      + "<td>"+brandName+"</td>" 
      + "<td>"+product+"</td>" 
      + "<td>"+nicotine+"</td>" 
      + "</tr>"); 

    }) 
}); 

答えて

2

$("img")だけでページ上のすべてのイメージをつかみます。おそらくあなたが望んでいたのは$("<img/>")でした。そんなにありがとう

var $row = $('<tr></tr>').appendTo('#tableBody'); 
$('<td></td>').appendTo($row).append($('<img />').attr('src', productImageUrl)); 
$('<td></td>').appendTo($row).text(brandName); 
$('<td></td>').appendTo($row).text(product); 
$('<td></td>').appendTo($row).text(nicotine); 
+0

恐ろしい:

一般的に、あなたのコードは、おそらくのようなものになるはずです。あなたのコードは、もはやきれいです:) –

関連する問題