Access 和 Office 加载项复选框选中状态

Question

在我的 Office 加载项中，我有一个如下所示的复选框：

<div class="ms-CheckBox">
    <input id="inputId" type="checkbox" class="ms-CheckBox-input" />
    <label id="labelId" role="checkbox" class="ms-CheckBox-field" aria-checked="false" name="checkboxA" for="inputId>
        <span class="ms-Label">Text</span>
    </label>
</div>

我想通过 JavaScript 检索它的检查状态（或者它的 aria-ckecked 状态，我仍然没有得到它们之间的区别），我认为是通过 document.getElementById( 'labelId' ).checked，因为在 the documentation 中指定他们有一个可选的 checked 成员，但我只得到一个 undefined。

我对这些技术还很陌生，有几个问题：

"optional member"是否意味着我必须显式创建它以便它存在？如果可以，我该怎么做？

但是 checked 成员可能会存在，我是否必须在每次用户单击它时手动处理它的值，或者它是否已经在内部管理，我只是没有找到方法访问了吗？

也许我只是看不到我在复选框的 html 代码中犯的错误？

提前致谢！

Answer 1

您在 Office sources of documentation 上有几个 UI Fabric 取决于您正在使用或即将使用的框架。您的选择是：

JavaScript only（无框架）
React
Angular

形成查找 table 你会选择 JavaScript only link 并按照它找到你感兴趣的组件。在此之前我建议阅读“开始使用 Fabric JS".

现在，如果您有关于 checkbox component 普通 JS 实现的文档，请按照步骤设置您的复选框。这包括：

确认您在页面上引用了 Fabric 的 CSS 和 JavaScript

将以下示例之一的 HTML 复制到您的页面中。

<div class="ms-CheckBox">
  <input tabindex="-1" type="checkbox" class="ms-CheckBox-input">
  <label role="checkbox" class="ms-CheckBox-field" tabindex="0" aria-checked="false" name="checkboxa">
      <span class="ms-Label">Checkbox</span> 
  </label>
</div>

将以下标记添加到您的页面，在对 Fabric 的 JS 的引用下方，以实例化页面上的所有 CheckBox 组件。

<script type="text/javascript">
    var CheckBoxElements = document.querySelectorAll(".ms-CheckBox");
    for (var i = 0; i < CheckBoxElements.length; i++) {
        new fabric['CheckBox'](CheckBoxElements[i]);
    }
</script>

要获取复选框的状态，请使用 getValue() returns true 或 false 组件是否被选中的方法。

Access 和 Office 加载项复选框选中状态

Access and Office add-in checkbox checked status

javascript

checkbox

outlook-addin

office-ui-fabric