无法处理jQuery ajax提交的简单表单

Question

我的表格 ：

<form id="new-protocol-form" method="post" role="form">
  <textarea name="text"></textarea>
</form>

---

我的jQuery ajax ：

$('#submitProtocol').click(
    function() {
        $.ajax({
            type:    "POST",
            url:     "newProtocol.php",
            data:    $('#new-protocol-form').serialize(),
            success: function() { alert{'ok'} },
            error:   function() { alert('error'); }
        });
    }
);

---

我的newProtocol.php ：

<script>
    alert(<?php echo $_POST['text']; ?>);
</script>

---

显示了由ajax'success'方法触发的带有'ok'文本的警报窗口，但是我无法从newProtocol.php文件中获得带有$_POST['text']值的警报窗口。 JavaScript控制台中没有错误。

Answer 1

您需要使用$_POST['text'] 。 您在不应该使用括号的地方。

另外，由于您正在使用AJAX，因此您可能不想导航到其他页面。 如果您不阻止默认行为，则成功功能中的警报将永远不会触发。

newProtocol.php

<?php
    echo $_POST['text'];
?>

jQuery的

$('#submitProtocol').click(function(event) {
        event.preventDefault(); // stop the default click behavior
        $.ajax({
            type:    "POST",
            url:     "newProtocol.php",
            data:    $('#new-protocol-form').serialize(),
            success: function(data) { 
                console.log(data); // show the text being returned 
            },
            error:   function() { console.log('error'); }
        });
    }
);

另外，请使用alert()退出以获取返回值并进行故障排除。

Answer 2

首先， $_POST不是函数，它是一个数组。 所以应该是$_POST['text'] 。 也，

<script>
    alert(<?php $_POST('text'); ?>);
</script>

不会创建您期望的警报，因为异步请求不会在目标页面中运行任何JavaScript。

由于您要测试AJAX是否正常工作，因此最好的方法是检查该请求返回的日期。 例：

//...
success: function(data) { console.log(data) },
//...