使用Ajax将JavaScript传递到PHP

我试图使用Ajax将JavaScript函数传递到一个php文件中，据我所见，我的Ajax语法是正确的，但它似乎不工作。这是我第一次尝试使用Ajax，因此任何帮助都将非常感谢。使用Ajax将JavaScript传递到PHP

我做了一些测试文件只是如果Ajax代码传递变量，我会把它下面测试 -

的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 -

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

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

来源

2016-11-20 Andrew Bruce

参见：http://stackoverflow.com/questions/21897398/how-do-i-debug-jquery-ajax-calls –

你为什么要使用'文件准备function''return'？你也可以在'$中添加'success'和'error'回调。ajax' –

就像我说的我是新来的Ajax，但看到了这种方式在网上返回数据的地方。什么是返回数据的最佳方式？ –

T 这里有很多方法可以解决这个问题。

1.-首先我们要确保我们能够在阿贾克斯这样做是为了发布数据到PHP：

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

2：我已经测试你的代码，并做了一些改动到PHP代码也是如此。

3.-现在一切似乎工作正常:)。

只需复制并粘贴下面的整个代码，您将看到结果（创建一个文件并将其命名为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>

来源

2016-11-20 23:22:38 HenryDev

嗨@HenryDev，非常感谢您的回答！我设法让它打印的数字很好，但现在当我试图在另一个条件语句中使用$ data变量时，它似乎不起作用。这个想法是，JavaScript生成一个随机的垃圾邮件问题，如果他们正确回答它，它会发送一封电子邮件。即 - if（$ spam == $ data）{ \t \t mail（$ to，$ subject，$ message，$ headers）; etc etc } 当邮件的额外代码在那里时，它甚至不会回显数字。我觉得我正在做一些完全错误的事情，但我不太确定！ –

@AndrewBruce我不确定你是如何实现你的发送邮件功能的，但我认为我的工作已经完成。我做了你问的是哪一个能够发送随机数到PHP。至少我应该接受我的答案，因为这是花费一些时间试图帮助你的正确答案:)。谢谢 – HenryDev

有我可以看到的小问题是 - dataType丢失和错误data格式，请参阅下面的代码 -

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

希望这会以某种方式帮助你（y）。

来源

2016-11-20 18:10:57 pradeep1991singh

感谢您的提示！虽然我修改了代码，但它仍然没有回显$回答：/ –

@Andrew请查看更新的代码并试一试。 – pradeep1991singh

不幸的是，它似乎没有用该代码记录控制台中的任何内容。它应该是？ –

您应该有一个完整的界面来显示返回的数据，或者只需要一些调试功能调用，如console.log来查看返回的数据。下面是有一个按钮做Ajax调用，并显示一个div内的结果基于您的代码示例脚本页面：

HTML

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

PHP在的的beggining PHP文件时，<!DOCTYPE html>标签之前

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

的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); 
      } 
     }); 
    }); 
});

现在你有你的随机生成号码发送到你的服务器端PHP脚本，然后返回值显示它到一个html div元素。

来源

2016-11-20 18:37:03

使用Ajax将JavaScript传递到PHP

回答

相关问题