在网页上打印多个选定图像

我的问题是我正在为朋友设计一个网站。我所做的是设置一个缩略图列表，每个缩略图下方都有一个按钮，可以在新窗口中打开相应的图像，打印它并关闭窗口。现在他决定他希望在缩略图旁边的复选框被选中时，单击按钮将打印所有选定的图像。这可能吗？如果是这样，有人可以向我解释吗？谢谢你的时间。在网页上打印多个选定图像

来源

2012-06-14 Brandon L. Collins

当然这是可能的 - 任何你可以想象的是。但是这个问题很普遍，没有看到你已有的代码，任何人都很难帮助你。 – hackartist

我认为是这样的：D简而言之，我在160x160图像的网格中的每个图像下都有一个按钮，并且在onClick按钮中，它只是使用较大版本的图像加载一个html页面。在这个页面上有一个window.print（）;和window.close（）;功能在身体标签。这也正是他想要的方式。但是现在他希望它在每幅图像旁边都有一个复选框，并且一个中央打印按钮可以将所选大图像并排放入一个新页面，并将它们全部打印在该页面上。 –

这里是你可以做的多种可能的方式这样一种方式：

一步一个：使周围的一切，并在表单内的表单，旁边或每个图像下方放一个复选框和唯一的ID，我们可以用它来识别它是如此例如

<input type="checkbox" id="imageNumber3"/>

只是这样以后就可以使用id来判断哪些图像本来是哪一个。请阅读forms and check boxes。

第二步：做一个javascript函数来获取该复选框，目前像选择，以便

function getChecked(form) { 
    var names; 
    var c = document.getElementById(form).getElementsByTagName('input'); 
    for (var i = 0; i < c.length; i++) { 
     if (c[i].type == 'checkbox' && c[i].checked) { 
      names.append(c[i].id); 
     } 
    } 
    return names; 
}

此功能应该当你给它的形式复选框在的ID，穿行并检查每个框以查看它是否被检查。它将构建一个已选择并返回该数组的ID数组。

第三步：使得当按钮被点击，像这样

function printBunch(ids) { 
    var windowUrl = 'about:blank'; 
    var uniqueName = new Date(); 
    var windowName = 'Print' + uniqueName.getTime(); 

    var printWindow = window.open(windowUrl, windowName, 'left=50000,top=50000,width=0,height=0'); 

    for(id in ids) { 
     //assuming the image will be the next sibling of the checkbox 
     var currentImage = document.getElementById(id).nextSibling.innerHTML; 
     printWindow.document.write(currentImage); 
    } 
    printWindow.document.close(); 
    printWindow.focus(); 
    printWindow.print(); 
    printWindow.close(); 
}

那么对于按钮的onclick把被称为新的打印功能“printBunch（getChecked（））;”通过检查图像的ID。您可能需要更改一些代码，具体取决于您如何设置与复选框相关的图像，但这会让您开始。

来源

2012-06-14 21:02:22 hackartist

非常感谢。我会放弃并报告。 –

在网页上打印多个选定图像

回答

相关问题