2

我正在使用JSZip库来提取上传的 epub 文件。我可以成功地遍历它并在库中显示文件的名称：

zipEntry.name;

我可以找到带有字符串比较的 cover.jpg 文件。如何将我的 html 页面上的图像源设置为该封面？我试过了：

src=zipEntry;

和

src=zipEntry.name;

甚至可能吗？有没有一种简单的方法可以用 jQuery 做到这一点？

4

3 回答 3

4

我尝试在页面上放置一个空图像

<img id="testimg" />

然后使用此 javascript 代码显示来自 zip 文件的 PNG 图像：

var zipEntry = zip.file('test.png');
$('#testimg')[0].src = 'data:image/png;base64,' + base64_encode(zipEntry.asBinary());

这对我有用。有关工作代码的演示，请参阅此JSFiddle。

您将需要该功能base64_encode()（来自phpjs.org）：

function base64_encode (data) {
  // phpjs.org
  var b64 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
  var o1, o2, o3, h1, h2, h3, h4, bits, i = 0,
    ac = 0,
    enc = "",
    tmp_arr = [];

  if (!data) {
    return data;
  }

  do { // pack three octets into four hexets
    o1 = data.charCodeAt(i++);
    o2 = data.charCodeAt(i++);
    o3 = data.charCodeAt(i++);

    bits = o1 << 16 | o2 << 8 | o3;

    h1 = bits >> 18 & 0x3f;
    h2 = bits >> 12 & 0x3f;
    h3 = bits >> 6 & 0x3f;
    h4 = bits & 0x3f;

    // use hexets to index into b64, and append result to encoded string
    tmp_arr[ac++] = b64.charAt(h1) + b64.charAt(h2) + b64.charAt(h3) + b64.charAt(h4);
  } while (i < data.length);

  enc = tmp_arr.join('');

  var r = data.length % 3;

  return (r ? enc.slice(0, r - 3) : enc) + '==='.slice(r || 3);
}
于 2013-04-06T14:54:13.063 回答
1

您需要知道主机位于哪个图像上，而不仅仅是图像名称。或者在base64中有图像数据。

load image from external (or local) host:
<img src="{HOST}/cover.jpg"/>

base64:
<img src="data:image/jpg;base64,R0lGODdhMAAw....." />
于 2013-04-06T12:00:57.093 回答
0

嗨，我正在使用这个和用户 json 数组图像路径而不是使用 {"+http//......+"} 的源

for(i=0;i<10;i++){
document.getElementById("five_star").innerHTML = "<img alt='' src='images/activestar.png'>";
}
于 2013-09-25T06:03:26.833 回答