无法通过引导表thead中的ID获取元素值

如何解决无法通过引导表thead中的ID获取元素值

使用引导表；下面的代码为topic_name值返回一个空的getElementById，但是如果我将'input'移到thead之外，它将起作用。发生了什么，如何在广告中使用它？

<table id="table" class="table table-striped">
<thead>
  <tr>
    <th data-field="topic">
      <input type="text" name="topic_name" id="topic_name">
      <a onclick="topicButton()" href="##">this</a>
    </th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>some info here...</td>
  </tr>
</tbody>
</table>
<script>
function topicButton()
{ 
  var getThis=document.getElementById("topic_name").value;
  alert(getThis);
}
</script>

解决方法

测试了2个示例，并删除了一些引导表参数，删除了一个示例中的一个参数，而删除了另一个实例中的另一个参数。

对于我上面提交的代码（在添加了我的原始代码中包含的所有其他引导表参数之后-参见下面的列表），我删除了data-toggle="table"并成功了。在我的原始代码中，我删除了data-show-columns="true"，它起作用了……奇怪。

这是我附加到引导表的参数的列表：

  <table id="table" class="table table-striped table-borderless"
  data-toolbar="#toolbar"
  data-toggle="table" 
  data-cookie="true"
  data-cookie-id-table="topic_id"   
  data-pagination="true"
  data-search="true"
  data-sort-name="topic_id"
  data-sort-order="desc"
  data-unique-id="topic_id"
  data-show-columns="true"
  data-show-columns-toggle-all="true"   
  data-show-search-button="true"
  data-page-size="5"
  data-page-list="[5,10,25,50,100,all]"
  data-select-item-name="selectItemName"
  data-show-export="true">