Question

我已经被要求使用这种方法，坦率地说，id可以在2秒内完成这个服务器端但需要在javascript中完成。

所以这里，我需要从名为S_TeamMember的对象中返回的DB中检索二进制图像。其中一个属性是MainImg byte []

我使用JSON调用ashx Handler调用数据库并检索数据。

    $(function () {
    var queryparam = getUrlVars()["CatLink"];

    $.ajax({
        url: "TeamGroups.ashx",
        data: { CatLink:  queryparam },
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: OnTeamGroupsCompleted,
        error: OnPageFailM
    });
});

上面的JSON调用

     function OnTeamGroupsCompleted(result) {
    for (var i = 0; i < result.length; i++) {

        var name = result[i].Name;
        var recno = result[i].Recno;
        var mainimg = result[1].MainImg;
        var memholder = "<div class='PersonImageHolder'>" +
            "<div class='PersonImage'>" +
                "<img src='"+ mainimg +"'/>" + <------ PROBLEM IS HERE
            "</div>" +
            "<div class='PersonNameHolder inline-block'>" +
        "<div class='ImgHolderL inline-block'>" +
            "<img src='images/web/WhiteRibbonL.png' />" +
            "</div>" +
            "<div class='NameHolder inline-block'>" +
            "<p><a href='MemberDetail.aspx?TeammMemberLink="+ recno +"'>"+ name +"</a></p>" +
            "</div>" +
            "<div class='ImgHolderR inline-block'>" +
            "<img src='images/web/WhiteRibbonR.png' />" +
            "</div>" +
            "</div>" +
            "</div>";

        $('.Content').append(memholder);

    }
}

然后是如何迭代JSON结果在页面上用图像绘制div。我遇到的麻烦是将'MainImg'二进制数据解析为html图像标记。

我是如何做到这一点的？

非常感谢任何帮助

Answer 1

OnTeamGroupsCompleted中的结果[i] .MainImg的值是多少？ JSON格式本身不支持二进制数据。你可以：

写一个新的ashx
在网址中传递名称或ID
将ashx设置为img src
in ashx输出图像二进制数据

在javascript中：

"<img src='image.ashx?name"+ result[i].Name +"'/>" + <------ PROBLEM IS HERE

in image.ashx：

public void ProcessRequest(HttpContext context)
{
    string name = context.Request.QueryString["name"];
    //query database by name to get image binary data
    Byte[] bytes = ...;
    context.Response.ContentType = "image/png";
    context.Response.BinaryWrite(bytes);
}

Answer 2

我不认为使用javascript是可行的！但您可以将图像的URL存储在DB中并将其返回给浏览器。

通过JSON和ashx从DB中检索二进制图像然后转换为html中的图像？

2 个答案: