使用数据URI将字符串转换为图像

Question

我有一个要求，我需要从最终用户的html输入控件中获取一个字符串，并使用Javascript / Jquery将输入文本显示为图像。

我尝试了以下代码，但它没有给我图像。

        var imgEncodedString = 'data:image/png;base64,' + btoa($('#txtName').val());

        var img = document.createElement("img");
        // added `width` , `height` properties to `img` attributes
        img.width = "250px";
        img.height = "250px";
        img.src = imgEncodedString ;
        var preview = document.getElementById("img_preview");
        preview.appendChild(img);