您必须先检查这些：

Question

我有一个迷你Web应用程序，当用户与页面交互时填充JavaScript对象的内容。我添加了on('click', function() {}) 事件处理程序到页面上的按钮元素。

我想在事件处理程序中使用$.post方法将JavaScript对象发布/提交到PHP后端，并使用从PHP服务器/脚本接收的数据/消息异步更新“Div”元素。 / p>

console.log验证JavaScript对象是否正常，但我甚至无法从PHP脚本中收到“Hello World”字符串，更不用说处理JavaScript对象了。

这是我的代码：

HTML：

<button id="sbButton" type="button">Submit </button> <div id="output"></div>`

JS：

$(function() { 
    // populates name:value pairs as user interacts on the web page 
    var vInfo = {}; 
    $('#sbButton').on('click', function() { 

        $.post('http://localhost/ReceptionVisitorKiosk/response.php'‌, vInfo, function(data) { 
            console.log("Response Info " + data); 
            $('#output').text(data); 
        }); 
    });
}

PHP：按照kyshel和robert的建议尝试了他们的回复，没有任何帮助。

Answer 1

您必须先检查这些：

JavaScript有语法错误吗？（检查控制台）
你的PHP有语法或逻辑错误吗？（例如：在CentOS 7中，输入命令#tail -f /var/log/httpd/error_log）

如果没有错误，请尝试以下代码，它在我的服务器上正常工作：

实施例

<强>的index.html

<button id="foo">Click</button>
<div id="receive"></div>

<script type="text/javascript">
function runPost(){
    var object_a={name:"mike",sex:"male"};

    $.post("post.php", object_a, function(result){
        $("#receive").html(result);
    });
}


$("#foo").click(function() {
  runPost(); 
});
</script>

<强> post.php中

<?php
echo '<pre>' . var_export($_POST, true) . '</pre>';

echo "hello,world~";

<强>结果：

Answer 2

尝试以下代码段：

var objectToSend = {name:"Some Name", lastName:"Some last name"};
    $.post('url_to_php.php', objectToSend , function(response){
       console.log(response);
    });

在php中访问变量。

$name = $_POST["name"];
$lastName = $_POST["lastName"];
$data = //some object you are returning
header('Content-Type: application/json');
echo json_encode($data);

修改

我在http://phpfiddle.org/上测试了以下代码段。我无法保存，因为它需要注册，但您可以重新粘贴它。

<?php if(isset($_POST["name"])) { $name = $_POST["name"]; $data = "Thank you $name"; header('Content-Type: application/json'); echo json_encode($data); return false; } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title> PhpFiddle Initial Code </title> <script type="text/javascript" src="/js/jquery/1.7.2/jquery.min.js"></script> <style type="text/css"> </style> </head> <body> <div style="margin: 50px 10%;"> <button id="mybutton" type="button">Click to See</button> </div> <script> $("#mybutton").click(function() { // myurl can be an URL or PhpFiddle API, fopr example, //var myurl = "http://main.xfiddle.com/<?php echo pf_file('jh2-qj7'); ?>"; //console.log(myurl); var dataToSend = {name : "Robert"}; $.post(window.location.href, dataToSend , function(response){ alert(response); }); }); </script> </body> </html>

使用$ .post（）jQuery方法进行按钮点击事件

2 个答案:

您必须先检查这些：

实施例