无法通过 ID 在 bootstrap table thead 中获取元素值

unable to get element values by ID in bootstrap table thead

使用bootstraptable; returns 下面的代码是 topic_name 值的空 getElementById,但是如果我将 'input' 移到 thead 之外,它就可以工作。发生了什么,我如何让它在 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 个示例并删除了一些 bootstrap table 参数,删除了一个参数在 1 个示例中有效,删除了另一个在另一个示例中有效。

对于我上面提交的代码(在我添加了我的原始代码包含的所有额外 bootstrap table 参数之后 - 请参见下面的列表),我删除了 data-toggle="table" 并且它有效.在我的原始代码中,我删除了 data-show-columns="true" 并且它起作用了......奇怪。

这是我附加到 bootstrap table:

的参数列表

  <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">