Adobe Acrobat Pro表单按钮优化：一键完成文件附加与缩略图显示

需求说明 #

• 制作一个矩形按钮，技术人员点击后可打开Windows文件选择器，选择报销用的燃油/采购凭证文件
• 若选择的是图片类文件（如汽油收据JPEG），需同时在表单显示该图片的缩略图，并将文件附加到表单（提交后可在附件视图查看）
• 文件添加成功后弹出提示弹窗
• 当前实现存在两次选择文件的问题，需优化为一键完成所有操作

现有实现代码 #

按钮属性中的JavaScript代码 #

event.target.buttonImportIcon();

if (app.viewerVersion < 11) {
    import_pre_11();
} else {
    import_11();
}

文档级JavaScript（命名为import_file） #

// Initialize attachment number
attachment_num = 1;

// Initial location of file attachment icon
// The x value is incremented below
var oFAP = {x_init: -72, x: -72, y: -72};  // Below lower-left corner of the page

function import_pre_11() {

    if (app.viewerType === "Reader") {
        app.alert({
            cMsg: "You must user Reader version 11 or later to attach files to this form.",
            cTitle: "Attach File Error",
            nIcon: 3,
            nType: 0
        });

        return;
    }

    // Prompt user to import a file
    app.alert({
        cMsg: "Click the OK/Open button after selecting the file from your system that you want to attach.",
        cTitle: "Attach File",
        nIcon: 3,
        nType: 0
    });
    
    try {
        var rc = this.importDataObject("Attachment" + attachment_image);

        if (rc) {
            attachment_num += 1;
            app.alert({
                cMsg: "Attachment successful.\r\rOpen the Attachments panel to access the attached file(s).",
                cTitle: "Attachment Successful",
                nIcon: 3,
                nType: 0
            });
        } else {
            app.alert({
                cMsg: "Attachment cancelled.",
                cTitle: "Attachment Cancelled",
                nIcon: 3,
                nType: 0
            });
        }
    } catch (e) {
        app.alert({
            cMsg: "Could not attach file.",
            cTitle: "Could not attach file",
            nIcon: 3,
            nType: 0
        });
    }
}

function import_11() {
    try {
        var annot = addAnnot({
            page: event.target.page,
            type: "FileAttachment",
            author: "Form user",
            name: "File Attachment",
            point: [oFAP.x, oFAP.y],
            contents: "File attachment on: " + util.printd("yyyy/mm/dd HH:MM:ss", new Date()),
            attachIcon: "Paperclip"
        });

        if (annot) app.alert("Attachment successful.",3);
        oFAP.x += 18;  // Increment the x location for the icon   
    } catch (e) {
        app.alert({
            cMsg: "Could not attach file.\r\rPlease report this error.",
            cTitle: "File attachment error",
            nIcon: 3,
            nType: 0
        });
    }  
}

优化方案（一键完成操作） #

修改思路 #

问题根源是buttonImportIcon()会触发一次文件选择（用于设置按钮图标），之后调用的import_pre_11()或import_11()又会触发一次文件选择（用于添加附件）。我们需要合并这两个操作：让用户只选择一次文件，同时完成按钮图标设置和附件添加。

优化后的按钮JavaScript代码 #

// 只触发一次文件选择，获取文件路径和数据
var file = app.openDialog("选择报销凭证文件", "图像文件:*.jpg;*.jpeg;*.png;*.pdf;所有文件:*.*", false);
if (!file || file.length === 0) {
    app.alert("未选择任何文件", 3, 0, "操作取消");
    return;
}
var selectedFile = file[0];

// 1. 设置按钮图标（显示缩略图）
event.target.buttonImportIcon({cPath: selectedFile});

// 2. 添加文件附件到表单
if (app.viewerVersion < 11) {
    import_pre_11_optimized(selectedFile);
} else {
    import_11_optimized(selectedFile);
}

优化后的文档级JavaScript（替换原import_file） #

// Initialize attachment number
var attachment_num = 1;

// Initial location of file attachment icon
var oFAP = {x_init: -72, x: -72, y: -72};  // Below lower-left corner of the page

function import_pre_11_optimized(filePath) {
    if (app.viewerType === "Reader") {
        app.alert({
            cMsg: "需要使用Reader 11或更高版本才能添加附件",
            cTitle: "附件添加错误",
            nIcon: 3,
            nType: 0
        });
        return;
    }

    try {
        var rc = this.importDataObject("Attachment" + attachment_num, {cPath: filePath});
        if (rc) {
            attachment_num += 1;
            app.alert({
                cMsg: "附件添加成功\n\n可在「附件面板」查看已添加的文件",
                cTitle: "操作成功",
                nIcon: 1,
                nType: 0
            });
        } else {
            app.alert({
                cMsg: "附件添加取消",
                cTitle: "操作取消",
                nIcon: 3,
                nType: 0
            });
        }
    } catch (e) {
        app.alert({
            cMsg: "无法添加附件: " + e.message,
            cTitle: "添加失败",
            nIcon: 3,
            nType: 0
        });
    }
}

function import_11_optimized(filePath) {
    try {
        var annot = addAnnot({
            page: event.target.page,
            type: "FileAttachment",
            author: "表单用户",
            name: "报销凭证_" + attachment_num,
            point: [oFAP.x, oFAP.y],
            contents: "附件添加时间: " + util.printd("yyyy/mm/dd HH:MM:ss", new Date()),
            attachIcon: "Paperclip",
            cPath: filePath
        });

        if (annot) {
            attachment_num += 1;
            oFAP.x += 18; // 调整下一个附件图标的位置
            app.alert({
                cMsg: "附件添加成功\n\n可在「附件面板」查看已添加的文件",
                cTitle: "操作成功",
                nIcon: 1,
                nType: 0
            });
        } else {
            app.alert("附件添加失败", 3, 0, "操作失败");
        }
    } catch (e) {
        app.alert({
            cMsg: "无法添加附件: " + e.message,
            cTitle: "添加失败",
            nIcon: 3,
            nType: 0
        });
    }  
}

关键修改点 #

1. 使用app.openDialog()统一触发一次文件选择，获取文件路径后复用该路径完成两个操作
2. 移除原代码中重复的文件选择逻辑，将文件路径作为参数传递给附件添加函数
3. 修复原代码中attachment_image未定义的错误（改为使用attachment_num）
4. 优化提示文案，让用户更清晰了解操作结果
5. 为附件标注序号和时间，方便管理

内容的提问来源于stack exchange，提问作者Kelvin Spicer