2016-11-20 6 views
0

JavaScript関数をAjaxを使ってPHPファイルに渡そうとしていますが、私のAjax構文が正しいとは限りませんが、動作していないようです。 Ajaxを使用しようとしたのは今回が初めてです。どんな助けでも大歓迎です。Ajaxを使用してPHPにJavaScriptを渡す

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; 
?> 

私はAjaxのコードは、変数を渡し、私は以下のことを出してあげるならば、単にテストするために、いくつかのテストファイルを作りました

+0

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

+0

なぜあなたは ''ドキュメント準備function'でreturn'を使用していますか? 'success'と' error'コールバックを '$に追加することもできます。ajax' –

+0

私はAjaxを初めて使ったと言いましたが、オンラインのどこかでデータを返すその方法を見ました。データを返す最善の方法は何でしょうか? –

答えて

0

ここでこれを解決する方法はたくさんあります。

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> 
+0

こんにちは@HenryDev、あなたの答えに非常に感謝!私はそれが良い数値を印刷することができたが、今私は別の条件文で$データ変数を使用しようとしているときに動作していないようです。アイデアは、Javascriptがランダムなスパム質問を生成し、正しく答えると電子メールを送信することです。 - if($ spam == $ data){ \t \t mail($件名、$メッセージ、$ヘッダ); など } メールに余分なコードが入っていると、もう数字をエコーし​​ていないようにも見えません。私は何かが完全に間違っているように感じるが、私はあまりよく分からない! –

+0

@AndrewBruceメールの送信機能をどのように実装したのか分かりませんが、私の仕事は終わったと思います。私はあなたが尋ねたことを、どの乱数をPHPに送ることができるのかを行いました。少なくとも私は、あなたを助けようとしている時間を過ごすための正しい答えとして私の答えを受け入れるに値します。ありがとう – HenryDev

1

私が見ることができる小さな問題があります - dataTypeが不足していて間違っていますdataのフォーマットは、以下のコードを参照してください -

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

これは何らかの方法で(y)お手伝いします。

+0

チップをありがとう!私はコードを変更しましたが、それでも$ answer:/ –

+0

@Andrewは、更新されたコードを見て試してみてください。 – pradeep1991singh

+0

これはまだ残念ながらうまくいきません。そのコードでコンソールに何も記録していないようです。それはすべきでしょうか? –

0

返されたデータを表示するには完全なインターフェイスが必要です。返されたデータを表示するには、console.logのようなデバッグ関数呼び出しが必要です。のbegginingで

HTML

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

PHP:ここではAJAX呼び出しを行うためのボタンがあり、その結果がdivの内側に表示されているあなたのコードに基づいて、サンプルスクリプトページです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要素に表示されます。

関連する問題