Input框内容改变触发事件,实现表格动态模糊查询

实现效果

通过给查询框添加绑定事件,实现BootStrap中输入值变化后自动查询并刷新数据,不需要点击查询按钮。

踩坑记录

$("#input").change(function(){
    //要实现的操作
});

这种方式下只有当input框失去焦点后才会触发,不能达到理想的效果。

最终实现

$("#input").bind("input propertychange",function(){
    //要实现的操作
});

完整测试代码

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>测试</title>
    <script type="text/javascript" src="Js/jquery-3.4.1.js"></script>
    <script>
        $(function () {
            /*$("[name=inputText]").change(function () {
                $("[name=respText]").val($(this).val());
            });*/
            $("[name=inputText]").bind("input propertychange",function () {
                $("[name=respText]").val($(this).val());
            });
        });
    </script>
</head>
<body>
<input type="text" name="inputText" placeholder="输入内容">
<input type="text" name="respText" placeholder="响应内容">
</body>
</html>

猜你喜欢

转载自blog.csdn.net/zh137289/article/details/107432730