Javascript AJAX JQuery表单提交只工作一次（需要刷新页面）

当页面加载时，我可以检索一个结果，但当我更改输入并尝试重新填充更新表单时，我没有收到任何结果。有什么想法吗？当我检查参数时，浏览器正在接收新参数，但显然查询不会再次运行

$(function() { 
                $("#select_form").submit(function (e) {
                    e.preventDefault();
                    $.ajax({
                        url: 'select_price.php',
                        data: $('#select_form').serialize(),
                        type: 'POST',
                        success: function (data) {
                            console.log(data);

                            if(data){
                                $("#update_form").html(data);
                                $("#norecord").css('display','none');

                            }
                           else{
                                $("#norecord").css('display','block');

                            }

                        },


                    });

                });
                });

我的HTML

 <form action="" method="post" id="select_form"><select style="max-width: 125px;border-radius:5px;" class="form-control" name="cus_no" autocomplete="off">
                <?php

                $sql = "SELECT DISTINCT debcode FROM cicmpy WHERE cicmpy.region IS NOT NULL";
                $query = odbc_exec($conn, $sql);
                while ($row = odbc_fetch_array($query)) {
                    echo '<option value="' . ($row['debcode']) . '">' .($row['debcode']) . ' </option>';
                }


                ?>

                </select ></div><label>Item Number</label><input style="max-width: 125px; border-radius:5px;" type="text" class="form-control" id="auto_item" name="item_no"/>
                        <button style="margin-top: 15px;" type="submit" name="update" class="btn btn-primary">Manage</button>
                        <button style="margin-top: 15px;" type="button" name="new_price" id="new_price" class="btn btn-success pull-right">New Price</button></div>
        </div> </div>
                   </div>
        </div>
            </form>

项目编号
管理
新价格

您需要为提交按钮绑定一个单击事件处理程序，该按钮将以这种方式在将来的ajax请求中添加

$(function() {
  $("#select_form").submit(function(e) {
    e.preventDefault();
    $.ajax({
      url: 'select_price.php',
      data: $('#select_form').serialize(),
      type: 'POST',
      success: function(data) {
        console.log(data);

        if (data) {
          $("#update_form").html(data);
          $("#norecord").css('display', 'none');

        } else {
          $("#norecord").css('display', 'block');

        }

      },


    });

  });

    //Bind click event listener to the submit button
    $(document).on('click', 'button[type="submit"]', function() {
      $(this).parents('form').submit();
    });
});

---

首先，在HTML中，给按钮一个

id=“btn\u manage”

，并删除

type=“submit”

，否则您只是发布表单（这就是页面刷新的原因），而不是使用AJAX。在Javascript中，去掉

$（“#select_form”）.submit（函数（e）{

东西，只需为按钮本身注册一个事件处理程序，它将运行AJAX

更新HTML，然后尝试以下操作：

<script>
    $(function() {
        $("#btn_manage").on("click", function () {
            $.ajax({
                url: 'select_price.php',
                data: $('#select_form').serialize(),
                type: 'POST',
                success: function (data) {
                    console.log(data);

                    if(data){
                        $("#update_form").html(data);
                        $("#norecord").css('display','none');

                    } else {
                        $("#norecord").css('display','block');

                    }

                },
                error: function(data) {
                    console.log("Error: " + data)
                }
            });
        });
    });

    </script>

$（函数（）{
$（“#btn_管理”）。在（“单击”，功能（）{
$.ajax({
url:'select_price.php'，
数据：$（'#选择表格'）。序列化（），
键入：“POST”，
成功：功能（数据）{
控制台日志（数据）；
如果（数据）{
$（“#更新表格”）.html（数据）；
$（“#norecord”）.css（'display'，'none'）；
}否则{
$（“#norecord”）.css（'display'，'block'）；
}
},
错误：函数（数据）{
日志（“错误：+数据”）
}
});
});
});

你能显示更多的HTML（整个表单）吗？@pmahome奇怪，它没有显示。修复了。你能更详细地介绍一下吗？这就是它的外观吗？这非常有效。这也修复了我在一个表单问题上的两个按钮。