如何动态显示表格中的图像?

时间:2017-09-19 06:29:31

标签: javascript jquery image

我正在创建一个表,其数据通过以下脚本动态更改。我还想在组名旁边显示组的相应图像。当组名称发生变化时,图像也会发生变化。

该表格绝对正常。

我的ide中存在图像文件,因此提到的路径是正确的。但是不显示图像。

<script>
    //$, jQuery

    var lookupTable = {
    Palm: "PM",
    Cedar: "CED",
    Oak: "OA",
    Chinar: "CHI"
};

var setGroup = function(groupName) {
    var t  = jQuery('<div></div>').addClass('group');
    var tn = jQuery('<div></div>').addClass('group-name').appendTo(t);
    jQuery('<img>').attr('src','/examples/media/images/'+ groupName.toLowerCase() + '.png').appendTo(tn);
    jQuery('<span></span>').text(groupName).appendTo(tn);

    return t;
};

    $.getJSON('https://service_program', function(data){

        var taf = $('#item1').empty();      
        var tar = $('#item2').empty();
        var tat = $('#item3').empty();
        var tao = $('#item4').empty();


        jQuery.each(data, function(idx, game){

            if (game['Category'] === 1){
                var tr = $('<tr></tr>').appendTo(taf); 
            } else if (game['Category'] === 2) {
                var tr = $('<tr></tr>').appendTo(tar); 
            } else if (game['Category'] === 3){
                var tr = $('<tr></tr>').appendTo(tat);
            } else if (game['Category'] === 4){
                var tr = $('<tr></tr>').appendTo(tao);
            }

            $('<td></td>').text(game['group 1']).appendTo(tr);
            $('<td></td>').text(game['group 2']).appendTo(tr);
            $('<td></td>').text(game['itemName 1']).appendTo(tr);
            $('<td></td>').text(game['itemName2']).appendTo(tr);

        });         
    });

</script>

我哪里错了?

1 个答案:

答案 0 :(得分:0)

使用它:

$('<td></td>').$('<img>').attr('src','/examples/media/image/'+ groupName.toLowerCase() + '.png').appendTo(tr);