Question

因此，如果我不使用ajax进行设置，则效果很好。一旦包含ajax，该页面就会在网址栏上加载“？search = 63105”，但结果div中不会显示任何内容

HTML + jQuery

<form>
<input type="text" name="search" id="search" placeholder="Search"/>
</form>
<div id="results"></div>



<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function () {
 $("form").on('submit', (function(e){
   var search = $('#search').val();
   var dataString = 'search=' + search;
   e.preventDefault();
   $.ajax({
        type: "POST",
        url: "searchpost.php",
        data: dataString,
        success: function(data) {
            $('#results').html(data);
        }
     });
   });
 });
</script>

PHP页面

<?php
require_once('../config/db.php');
require_once('../customLIB/pdo_db.php');
require_once('../models/test.php');
$SalesRep = new SalesRep();

if ($_POST['search']) {
 $data = $_POST['search'];
 $rep = $SalesRep->getRep($data);

 if (!empty($rep)) {
    echo $rep->name;
  } else {
    echo "No sales reps found..";
  }
}
?>

同样，即使应该显示结果，也什么都没有显示。 PHP可以正常工作，这没问题。

谢谢。

Answer 1

表单提交功能，您有e.preventDefault()行，但是，该函数从未接受过事件参数e。

$("form").on('submit', (function(){
    e.preventDefault();
    //...
});

应该是

$("form").on('submit', (function(e) {
    e.preventDefault();
    //...
});

由于从未阻止过表单提交，因此表单照常提交并且AJAX调用未得到完全执行。

编辑：此外，以下几行

var search = $('#search').val();
var dataString = 'search=' + search;

应在Submit函数之内。只有这样，它才能在提交搜索期间获得#search的值。

EDIT4：发现执行var dataString = 'search=' + search;仍然可行，因此可以忽略EDIT2。

EDIT2：不太熟悉PHP方面，但是POST-ing数据通常由JavaScript对象完成。尝试让dataString成为

var dataString = { search: search };

或者更好，让表格自行序列化

var dataString = $('form').serialize();

EDIT3：找到了一个额外的括号，可能是造成此问题的原因。

$("form").on('submit', -->(function(e){

最终密码应为

$(function () {
    $("form").on('submit', function (e) {
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "searchpost.php",
            data: $('form').serialize(),
            success: function (data) {
                $('#results').html(data);
            }
        });
    });
});

Answer 2

您正在使用post方法，更改post参数数据：{'search'：search} 然后在PHP文件中插入echo，从PHP返回值。

如何正确设置简单的AJAX

2 个答案: