如何使用Word Add-in JS API在Word中添加复选框/下拉列表

一、复选框（Checkbox）的正确实现 #

你原代码的问题在于调用range.insertContentControl()时参数传递错误，该方法需要传入包含type属性的配置对象，而非直接传入枚举值。修正后的代码如下：

document.getElementById("btn-1").addEventListener("click", () => {
  Word.run(function (context) { 
    const range = context.document.getSelection(); 
    // 传入配置对象指定内容控件类型
    const myContentControl = range.insertContentControl({ 
      type: Word.ContentControlType.checkBox 
    }); 
    myContentControl.tag = 'CheckBoxTag';  
    myContentControl.title = '复选框示例';
    myContentControl.cannotEdit = false; 
    myContentControl.appearance = Word.ContentControlAppearance.boundingBox;
    context.load(myContentControl, 'id');  
    return context.sync();  
  }).catch(error => {
    console.error(error);
    if (error instanceof OfficeExtension.Error) {
      console.error('Debug info:', error.debugInfo);
    }
  });
});

二、下拉列表（DropDownList）的实现 #

下拉列表需要先创建对应类型的内容控件，再添加选项项：

document.getElementById("btn-dropdown").addEventListener("click", () => {
  Word.run(function (context) { 
    const range = context.document.getSelection(); 
    const dropdownControl = range.insertContentControl({ 
      type: Word.ContentControlType.dropDownList 
    }); 
    dropdownControl.tag = 'DropDownTag';  
    dropdownControl.title = '下拉列表示例';
    // 添加下拉选项
    dropdownControl.dropDownListItems.add("选项1", "value1");
    dropdownControl.dropDownListItems.add("选项2", "value2");
    dropdownControl.dropDownListItems.add("选项3", "value3");
    // 设置默认选中项（可选）
    dropdownControl.dropDownListItems.getItem(0).selected = true;
    dropdownControl.appearance = Word.ContentControlAppearance.boundingBox;
    context.load(dropdownControl, 'id');  
    return context.sync();  
  }).catch(error => {
    console.error(error);
    if (error instanceof OfficeExtension.Error) {
      console.error('Debug info:', error.debugInfo);
    }
  });
});

关键注意事项 #

• 所有Word JS API操作必须包裹在Word.run()中，确保上下文同步
• 操作完成后必须调用context.sync()提交更改
• 务必添加错误捕获逻辑，方便调试API调用问题
• 内容控件的type需通过配置对象传入，而非直接作为参数传递

内容的提问来源于stack exchange，提问作者Asjad Waseeq