嗨，我完全懂你的困扰！原来的搜索脚本之所以在带输入框的表格里失效，是因为$(this).text()方法只能拿到元素的文本节点内容，而输入框的实际内容存在它的value属性里，不属于文本节点，所以原来的逻辑根本没读到输入框里的内容，自然搜不到啦😯

咱们只需要调整一下脚本的逻辑，把每一行里所有输入框的value值也纳入搜索范围就行，我给你改好啦：

修改后的搜索脚本 #

$(document).ready(function(){
    $("#inputsearch").on("keyup", function() {
        var value = $(this).val().toLowerCase();
        $("#bodytableresults tr").filter(function() {
            // 1. 先收集当前行的普通文本内容
            var rowContent = $(this).text().toLowerCase();
            // 2. 遍历当前行里的所有输入框，把它们的value值也加入搜索池
            $(this).find("input").each(function() {
                rowContent += " " + this.value.toLowerCase();
            });
            // 3. 判断拼接后的内容是否包含搜索关键词，切换行的显示状态
            $(this).toggle(rowContent.indexOf(value) > -1);
        });
    });
});

对应的带输入框表格示例 #

<table>
    <thead>
        <tr>
            <th><input type="text" placeholder="Search...." id="inputsearch"></th>
        </tr>
    </thead>
    <tbody id="bodytableresults">
        <tr>
            <td><input type="text" value="Mike"></td>
        </tr>
        <tr>
            <td><input type="text" value="Joan"></td>
        </tr>
    </tbody>
</table>

小扩展说明 #

如果你的表格里还有其他表单元素（比如下拉选框<select>、多行文本框<textarea>），可以稍微扩展一下选择器，把它们的值也纳入搜索：

// 扩展收集内容的逻辑，覆盖更多表单元素
var rowContent = $(this).text().toLowerCase();
$(this).find("input, select, textarea").each(function() {
    var elemValue = $(this).val().toLowerCase();
    rowContent += " " + elemValue;
});

这样不管是纯文本、输入框、下拉框还是多行文本的内容，都能被搜索到啦～

备注：内容来源于stack exchange，提问作者mcastro