使用Ajax将JavaScript传递到PHP

Question

I'm attempting to pass a JavaScript function into a php file using Ajax, as far as I can see my Ajax syntax is right but it doesn't seem to work. 我正在尝试使用Ajax将JavaScript函数传递到php文件中，据我所知，我的Ajax语法是正确的，但似乎不起作用。 This is the first time I've tried to use Ajax so any help would be much appreciated. 这是我第一次尝试使用Ajax，因此任何帮助将不胜感激。

I made some test files just to test if the Ajax code passes the variable and I'll put it below - 我制作了一些测试文件只是为了测试Ajax代码是否通过了变量，并将其放在下面-

script.js - script.js-

var number1 = Math.round(Math.random() * 6) + 1;
var number2 = Math.round(Math.random() * 6) + 1;
var randomAnswer = number1 + number2;

$ (document).ready(function() {
return $.ajax({
    url: 'index.php',
    type: 'POST',
    data: randomAnswer,
    });
});

index.php - index.php-

<script src = "jquery-3.1.1.min.js"></script>
<script src = "script.js"></script>

<?php
$answer = $_POST ['randomAnswer'];
echo $answer;
?>

Answer 1

There is small issues i can see is - dataType is missing and wrong data formatting, see code below - 我可以看到的小问题是dataType丢失且data格式错误，请参见下面的代码-

$ (document).ready(function() {
 $.ajax({
    url: 'index.php',
    type: 'POST',
    dataType:'json', 
    data: ({randomAnswer: randomAnswer}),
    success: function(data) {
       console.log(data);
    }
  });
});

Hope this will help you in some way (y). 希望这会对您有所帮助（y）。

Answer 2

You should have a complete interface in order to display the returned data, or just have some debug function calls like console.log to view the returned data. 您应该具有完整的界面才能显示返回的数据，或者只需要进行一些调试功能调用（例如console.log即可查看返回的数据。 Here is a sample script page based on your code that has a button to do the ajax call, and have the result displayed inside a div: 这是一个基于您的代码的示例脚本页面，该页面具有一个用于执行ajax调用的按钮，并将结果显示在div中：

HTML 的HTML

<div id="output">0</div>
<button id="getOutput">Get AJAX Random Answer</button>

PHP At the beggining of the PHP file, before the <!DOCTYPE html> tag PHP在PHP文件的开头，在<!DOCTYPE html>标记之前

<?php
if(isset($_POST['randomAnswer'])) {
    $answer = $_POST['randomAnswer'];
    die($answer);
}
?>

jQuery Javascript jQuery Javascript

$(document).ready(function() {
    $('#getOutput').on('click', function() {
        var number1 = Math.round(Math.random() * 6) + 1;
        var number2 = Math.round(Math.random() * 6) + 1;
        var randomAnswer = number1 + number2;

        $.ajax({
            url: 'numecho.php',
            type: 'POST',
            data: {
                randomAnswer: randomAnswer
            },
            complete: function(data) {
                $('#output').text(data.responseText);
            }
        });
    });
});

Now you have your random generated number sending to your server side PHP script and then returning the value back displaying it to an html div element. 现在，您将随机生成的数字发送到服务器端PHP脚本，然后将值返回显示给html div元素。

Answer 3

T here are many ways to solve this. 这里有很多解决方法。

1.- First let's make sure we were able to post data to PHP by doing this in Ajax: 1.-首先，让我们确保能够通过在Ajax中执行以下操作将数据发布到PHP：

success: function (result) {
    alert("result: " + result);
}

2.- I have tested your code and made some changes to the PHP code as well. 2.-我已经测试了您的代码，并对PHP代码也进行了一些更改。

3.- Now everything seems to be working fine :). 3.-现在一切似乎都很好：)。

Just copy and paste this entire code below and you will see the results (create a file and called it index.php). 只需在下面复制并粘贴整个代码，您将看到结果（创建一个文件并将其命名为index.php）。

 <?php

   $data = array();
   if(isset($_POST['randomAnswer']) && !empty($_SERVER['HTTP_X_REQUESTED_WITH'])) {
   $data = 'You number is: ' . $_POST['randomAnswer'];       
   echo json_encode($data);  
   die();      
    }
 ?>
 <html>
 <head>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 </head>

 </body>
 <div id = "random"></div>

 <script type = "text/javascript">

$(document).ready(function() {

var number1 = Math.round(Math.random() * 6) + 1;
var number2 = Math.round(Math.random() * 6) + 1;
var randomAnswer = number1 + number2;

$.ajax({
   url: "index.php",
   method: "POST",
   dataType: "json",
   data: {randomAnswer: randomAnswer},
   success: function (result) {
      alert("result: " + result);
      $("#random").html(result);
   }
 });

});

</script>

</body>
</html>

使用Ajax将JavaScript传递到PHP

问题描述

3 个解决方案

解决方案1
1 2016-11-20 18:10:57

解决方案2
0 2016-11-20 18:37:03

解决方案3
0 已采纳 2016-11-20 23:22:38

使用Ajax将JavaScript传递到PHP

问题描述

3 个解决方案

解决方案1 1 2016-11-20 18:10:57

解决方案2 0 2016-11-20 18:37:03

解决方案3 0 已采纳 2016-11-20 23:22:38

解决方案1
1 2016-11-20 18:10:57

解决方案2
0 2016-11-20 18:37:03

解决方案3
0 已采纳 2016-11-20 23:22:38