基本的なAjaxスクリプトの試行がうまくいかないのはなぜですか？

私は現在、Ajaxの基本を例を用いて学習しようとしています。基本的なAjaxスクリプトの試行がうまくいかないのはなぜですか？

<?php 

if($_POST) { 
    echo "<p>ok</p>"; 
} 

?>

は誰でもすることができます：次のコードが含まれていますAJAX-script.phpという名前の単純なPHPファイルと組み合わせる

<!DOCYTPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"> 
$(function(){ 
    $('#mybtn').on('click', function(e){ 
    e.preventDefault(); 
    $('#mybtn').fadeOut(300); 

    $.ajax({ 
     url: 'ajax-script.php', 
     type: 'post', 
    }); // end ajax call 
    }); 
</script> 
</head> 

<body> 
    <a href='#' id='mybtn'>click me</a> 
</body> 

</html>

：基本的なチュートリアルに従うことで、私は次のスクリプトを作成することができました私が間違っていたかもしれないものを特定しますか？どうすればこの作品を作れますか？

出典

2016-05-16 John Smith

機能していませんか？あなたは何が起こると期待していますか達成しようとしていますか？ – Marcus

あなたは成功関数を持っていません - それはechoされたPHPデータを受け取ります。

さらに、scriptタグを閉じてjQueryライブラリをロードし、別のスクリプトタグを使用してJavaScriptコードを記述する必要があります。

これを試してみてください：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script> 
    $(function(){ 
     $('#mybtn').on('click', function(e){ 
     e.preventDefault(); 
     $('#mybtn').fadeOut(300); 

     $.ajax({ 
      url: 'ajax-script.php', 
      type: 'post', 
      success: function(d){ 
       alert(d); 
      } 
     }); // end ajax call 
    }); 
</script>

また、あなたのif ($_POST)が問題を引き起こす可能性がある - のいずれかのことを削除するか、いくつかのデータをポスト：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script> 
    $(function(){ 
     $('#mybtn').on('click', function(e){ 
     e.preventDefault(); 
     $('#mybtn').fadeOut(300); 

     $.ajax({ 
      url: 'ajax-script.php', 
      type: 'post', 
      data: 'test=Hello', 
      success: function(d){ 
       alert(d); 
      } 
     }); // end ajax call 
    }); 
</script>

その後、あなたはあなたのPHPは何をエコーするために得ることができますこのように、送信された：

<?php 
    if($_POST) { 
     $recd = $_POST['test']; 
     echo 'PHP side received: ' . $recd; 
    } 
?>

出典

2016-05-16 16:10:55 gibberish

お返事ありがとうございます。不思議なことに、どちらもうまく動作していないようです。投稿した2番目のJSコードをajax.phpという名前のファイルにコピーして貼り付けて、提供したものでphpファイルを更新しました。私はそれを私のサーバ（ここではwww.theshitpit.com/beta/ajax.php）にアップロードしました。なぜこれはまだ動作していない可能性がありますか？ –

@JohnSmith私は別の "回答" *として回答を追加しました（最初の回答が大きすぎるのを防ぐため）*また、この記事の[**例**]から有用な情報を得るかもしれません。 stackoverflow.com/questions/17973386/ajax-request-callback-using-jquery/17974843#17974843） – gibberish

あまりにも一枚岩になってから最初の答えを防ぐために、私はあなたに応答しますこの新しい答えにコメントしてください。

しようとするいくつかのこと：あなたのajax.phpファイルの

（1）場所 - それはjavascriptのコードをページと同じフォルダにありますか？

ajax.phpファイルの

（2）名前 - それはあなたのコード内のことに注意してくださいajax-script.php

（3）私は、ボタンのクリック後にアラートを追加 - それが来たのですか？

（4）IF条件を削除しました。ajax.phpファイルは、何かに関わらず何かをjavacript success関数にエコーバックします。

（5）jQueryが機能していることを確認するため、jQueryコードを追加して背景を色付けしました。バックグラウンドが少しばかりではない場合、jQueryはロードされていません。

これを修正しましたか？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script> 
    $(function(){ 
     $('body').css('background','wheat'); 
     $('#mybtn').on('click', function(e){ 
     alert('Button clicked'); //<========================== 
     e.preventDefault(); 
     $('#mybtn').fadeOut(300); 

     $.ajax({ 
      url: 'ajax.php', 
      type: 'post', 
      data: 'test=Hello', 
      success: function(d){ 
       alert(d); 
      } 
     }); // end ajax call 
    }); 
</script>

その後、あなたはあなたのPHPは、このように、あなたが送信したものエコー得ることができる：

<?php 
    $recd = $_POST['test']; 
    echo 'PHP side received: ' . $recd; 
?>

出典

2016-05-16 17:44:51 gibberish

基本的なAjaxスクリプトの試行がうまくいかないのはなぜですか？

答えて

関連する問題