Javascript 单击按钮搜索数据表，而不是键入输入

我想知道对于由

DataTables

修改的表，是否可以将搜索功能从

输入中移出。目前，我有一个执行此函数的自定义输入：

<script>
    $(document).ready(function() {
        var oTable = $('#staffTable').DataTable();
        $('#searchNameField').keyup(function () {
            oTable.search($(this).val()).draw();
        });
    })
</script>


$（文档）.ready（函数（）{
变量oTable=$（'#staffTable'）.DataTable（）；
$（'#searchNameField'）.keyup（函数（）{
oTable.search（$（this.val（））.draw（）；
});
})

输入如下所示：

<label for="searchNameField" class="col col-form-label">Name:</label>
<div class="col-sm-11">
    <input type="text" class="form-control ml-0 pl-2" id="searchNameField"
            placeholder="Name" autofocus/>
</div>

名称：

我想做的是把这个移动到一个按钮。我认为可能的情况如下：

<script>
    $(document).ready(function() {
        var oTable = $('#staffTable').DataTable();
        $('#searchButton').click(function () {
            oTable.search($(this).val()).draw();
        });
    })
</script>


$（文档）.ready（函数（）{
变量oTable=$（'#staffTable'）.DataTable（）；
$（“#搜索按钮”）。单击（函数（）{
oTable.search（$（this.val（））.draw（）；
});
})

按钮看起来是这样的：

<button id="searchButton" type="button" class="btn btn-sm btn-success" style="width: 150px">
    <i class="fa fa-search">
        Search
    </i>
</button>


搜寻

但是，当我点击按钮时，这不起作用。键入此问题时，我意识到这可能是因为当我单击按钮时，它不知道从何处获取筛选文本以实际筛选表

有没有一种方法可以让我点击一个按钮来引用输入，然后去过滤表格？
没错，你需要重新定义
$（这个）
，它现在指的是按钮，而不是搜索框：

$(document).ready(function() {
    var oTable = $('#staffTable').DataTable();
    $('#searchButton').click(function () {
        oTable.search($("#searchNameField").val()).draw();
    });

    // EDIT: Capture enter press as well
    $("#searchNameField").keypress(function(e) {
        // You can use $(this) here, since this once again refers to your text input            
        if(e.which === 13) {
            e.preventDefault(); // Prevent form submit
            oTable.search($(this).val()).draw();
        }
    });
});

非常好，詹姆斯，谢谢。当用户在
#searchNameField
中时，有没有一种方法可以使用enter press启动此功能？有趣的是，这确实执行了搜索，但同时也刷新了页面。这通常意味着它位于捕获enter press并提交的表单中。编辑传入。给它一个机会，@CBreezeFantastic。我将确保更详细地了解这是如何工作的，并在我有能力的时候接受这个答案。谢谢