jquery 表单提交并在 div 中显示结果而无需重新加载

Question

美好的一天，

我在 stackoverflow 上找到了下面的一些代码，但我一生都无法让它工作。我已经玩了一点代码，但我仍在学习 javascript （慢慢地）和 jquery。

我想做的是有一个带有搜索输入的搜索 div，但我不想重新加载页面，而是希望在搜索下方有一个 div 来显示结果，而不需要重新加载。输入搜索内容并单击“搜索”。这是我的代码，它不执行任何操作，我可能会添加：

我的 jquery 版本是 1.5.2，并加载了 include("javascript.php");

<?php
include("search_div.php");
include("javascript.php");
?>

<script type="text/javascript">

$("search").submit(function() {
    $.post($(this).attr("action"), $(this).serialize(), function(html) {
        $("#results").html(html);
    });
    return false; // prevent normal submit
});

</script>

<div id="content">

    <div id="searchdiv">
        <form type="submit" onsubmit="return false;" name="search" id="search" method="post">
        <table border="0" width="850" id="searchquery" cellpadding="0" cellspacing="0">
            <tr><td align="center">Search Query: <input type="text" size="50" id="q" name="q"></td></tr>
        </table>
        <table border="0" width="850" id="searchquerybuttons" cellpadding="0" cellspacing="0">
        <td align="right" width=840><input type="Submit" value="Search">
        </table>

        </form>
    </div> <!-- end search div -->

    <div id="results">
        <?php
        if (isset($_POST['q'])) {
            echo "<br><br>Query is: ".$_POST['q'];
            }
        ?>
    </div>  <!-- End results div -->

</div> <!-- End content div -->

<?php
include ("footer.php");
?>

</div> <!-- End of container div -->

Answer 1

你检查过输出的 HTML 源吗？

您是否检查了 javascript 错误控制台以查看错误是什么（如果有）？

javascript.php 的内容是什么？您不能将 javascript 库包含在 PHP 中。您应该使用类似的内容：

<script type="text/javascript" src="scripts.js"></script>

另外，this:

$("search").submit(function() {

应该是：

$("#search").submit(function() {

并且您应该从

HTML 中删除 onsubmit 属性。