即时搜索:功能未定义错误

时间:2014-01-04 17:07:42

标签: jquery

我有一个基本的php / MySQL搜索。我的表单使用jQuery函数捕获键击,然后执行Ajax调用,最终应该提供与键击相关的结果。我收到函数searchquery is not defined的错误。然后我去验证了语法,在我看来是正确的。 DEMO

<script type="text/javascript">
    $(document).ready(function() {
        (function($) {
            $.fn.searchquery = function() {
                $.post("insta_search.php", {searchVal: searchTxt}), function(output) {
                    $("#output").html(output);
                });
            };
        });
    });
</script>
</head>
<body>
    <h2>Search</h2>
    <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
        <input type="text" name="search" placeholder="Search for stuff" onkeydown="searchquery();"/>
        <input name="submit" value=">>" type="submit">
        <br />
        <div id="output" name="output">
        </div>

2 个答案:

答案 0 :(得分:2)

$(document).ready(function () {
     searchquery = function() {
        $.post("insta_search.php", {searchVal: $("input[name='search']").val()}, function(output) {
        $("#output").html(output);
        });
     };
});

更好的方法是不要混合内容中的行为(即不要在html中混合使用js)

<script type="text/javascript">
    $(document).ready(function() {
        $("input[name='search']").keydown(function(){
            $.post("insta_search.php", {searchVal: $("input[name='search']").val()}, function(output) {
                $("#output").html(output);
            });
        });
    });
</script>
</head>
<body>
    <h2>Search</h2>
    <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
        <input type="text" name="search" placeholder="Search for stuff" />
        <input name="submit" value=">>" type="submit">
        <br />
        <div id="output" name="output">
        </div>

答案 1 :(得分:0)

似乎你有一个多余的括号。试试这件:

$(document).ready(function() {
  (function($) {
    $.fn.searchquery = function() {
      $.post("insta_search.php", { searchVal: searchTxt }, function(output) {
        $("#output").html(output);
      });
    };
  });
});