如何获取标题单元格的当前值？（包括嵌套标题）答案

【问题标题】：How to get current value of header cell? (incl. nested headers)如何获取标题单元格的当前值？（包括嵌套标题）
【发布时间】：2017-04-28 17:18:59
【问题描述】：

我有一个handsontable，其中一些标题是复选框，其中一些是选择框。

如何访问标题以检查标题单元格内的选择/复选框的值？

JSFiddle（带有嵌套标题 - 与我的项目相同）：http://jsfiddle.net/Lmh50uwu/

我想访问mybox 和myselect 的值

$("#mybox") 或$("#myselect") 不起作用。

我希望能够在 DOM 加载后的任何时候检查 myselect 和 mybox 的值。

document.addEventListener("DOMContentLoaded", function() {

  var example1 = document.getElementById('example1');
  
  var hot = new Handsontable(example1, {
    data: Handsontable.helper.createSpreadsheetData(5,10),
    colHeaders: true,
    rowHeaders: true,
    nestedHeaders: [
      ['<input type="checkbox" id="mybox">', {label: 'B', colspan: 8}, 'C'],
      ['<select id="myselect" name="menu" class="selectpicker"><option value="LVW">LVW</option><option value="SIM">SIM</option></select>', {label: 'E', colspan: 4}, {label: 'F', colspan: 4}, 'G'],
      ['H', {label: 'I', colspan: 2}, {label: 'J', colspan: 2}, {label: 'K', colspan: 2}, {label: 'L', colspan: 2}, 'M'],
      ['N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W']
    ]
  });
  
  
});

$("#mybox").remove();

console.log("test")
var elem = document.getElementById("myselect");
// console.log(elem.value); // elem is null here

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://docs.handsontable.com/pro/1.0.0/bower_components/handsontable-pro/dist/handsontable.full.min.js"></script>
<link type="text/css" rel="stylesheet" href="https://docs.handsontable.com/pro/1.0.0/bower_components/handsontable-pro/dist/handsontable.full.min.css">
<div>
  <div id="example1" class="hot handsontable htRowHeaders htColumnHeaders"></div>
</div>

编辑：更新：http://jsfiddle.net/Lmh50uwu/2/

编辑：将 sn-p 添加到我的帖子中，但无法测试，因为我的公司阻止访问它。

【问题讨论】：

标签： javascript jquery html handsontable

【解决方案1】：

事实证明，行和列标题中的自定义 HTML 元素需要通过类名而不是 id 来标识。 这是因为行和列标题在 DOM 树中是重复的，并且 id 属性必须是唯一的。

（见此链接：http://bollwyvl.github.io/jquery-handsontable/demo/renderers_html.html）

解决方案：

将<input type="checkbox" class="mybox"> 与getter $(".mybox")[1].checked 一起使用

而不是

将<input type="checkbox" id="mybox">与getter $("#mybox").checked一起使用

【讨论】：