Jquery数据表搜索和显示条目位于我的表的左侧

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<input type="text" id="searchInput" placeholder="搜索...">
<select id="showEntries">
  <option value="5">显示5条</option>
  <option value="10">显示10条</option>
  <option value="15">显示15条</option>
</select>
<table id="dataTable">
  <!-- 表格内容 -->
</table>

$(document).ready(function() {
  // 获取表格和搜索框、显示条目的元素
  var table = $('#dataTable');
  var searchInput = $('#searchInput');
  var showEntries = $('#showEntries');

  // 监听搜索框输入事件
  searchInput.on('input', function() {
    var searchText = $(this).val().toLowerCase(); // 获取搜索关键字并转为小写
    table.find('tr').each(function() {
      var row = $(this);
      var rowData = row.text().toLowerCase(); // 获取当前行的文本内容并转为小写
      if (rowData.indexOf(searchText) === -1) {
        row.hide(); // 隐藏不匹配的行
      } else {
        row.show(); // 显示匹配的行
      }
    });
  });

  // 监听显示条目下拉菜单改变事件
  showEntries.on('change', function() {
    var numEntries = parseInt($(this).val()); // 获取选择的显示条目数
    table.find('tr').hide(); // 隐藏所有行
    table.find('tr:lt(' + numEntries + ')').show(); // 显示前N行
  });
});