我的问题是我正在为 friend 设计网站。我所做的是设置一个缩略图列表,每个缩略图下面都有一个按钮,可以在新窗口中打开相应的图像,打印它,然后关闭窗口。现在他决定在缩略图旁边添加复选框,选中后单击按钮将打印所有选中的图像。这可能吗?如果是这样,有人可以向我解释一下吗?感谢您的宝贵时间。
最佳答案
在许多可能的方法中,这是您可以执行此操作的一种方法:
第一步: 创建一个围绕所有内容并在表单内部的表单,在每个图像旁边或下方放置一个具有唯一 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。您可能需要更改一些代码,具体取决于您如何设置与复选框相关的图像,但这应该可以帮助您入门。
关于javascript - 在网页中打印多个选定的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11028261/