Question

以下のコードはindex.phpにあります。クリックすると、$ selection変数はajaxを通してajax.phpに渡され、データを処理し、＃div1をhtmlに置き換えます。

<script> 
$(document).ready(function(){ 
    $(".header").on("click", function(){ 
     var $selection = 'data to be transmitted'; 
     $.ajax({ 
      type: 'GET', 
      url: 'ajax.php', 
      data: { 'selection' : $selection }, 
      success: function(data) { 
       $("#div1").html(data); 
      } 
     }); 
    }); 
}); 
</script> 

次に、ajax.phpは$ _GET ['selection']を使用して$ selectionを処理します。しかし、ajax.phpの終わりに$ selection2を渡し、ajax2.phpするために別のAJAX呼び出しをある：

<script> 
$(document).ready(function(){ 
    $(".header").on("click", function(){ 
     var $selection2 = 'depends on $selection from ajax.php'; 
     $.ajax({ 
      type: 'GET', 
      url: 'ajax2.php', 
      data: { 'another_selection' : $selection2 }, 
      success: function(data) { 
       console.log(data); 
       $("#div2").html(data); 
      } 
     }); 
    }); 
}; 
</script> 

両方DIV1とDIV2は、index.phpの中で発見されました。私の問題は、（ajax2.phpへの）2番目のajax呼び出しが機能しないことです。＃div2をajax2.phpから受け取ったhtmlに置き換えることはありません。

アイデア？私はコンソールにログオンし、正しいhtmlであるので、返されるデータが正しいことを知っています。私の推測では、 "$（"＃div2 "）.html（data）;"これはajax.phpファイルにあり、＃div2が実際に存在するindex.phpでは見つからないため、行は機能しません。あなたがバインド/ルーチン紛争を経験している

Answer 1

は、内部で、一つにこれらのAJAX呼び出しを統一しようとする外部のコールバックか：

<script> 
$(document).ready(function(){ 
    $(".header").on("click", function(){ 
     var $selection = 'data to be transmitted'; 
     $.ajax({ 
      type: 'GET', 
      url: 'ajax.php', 
      data: { 'selection' : $selection }, 
      success: function(data) { 
       $("#div1").html(data); 
       var $selection2 = 'depends on $selection from ajax.php'; 
       $.ajax({ 
       type: 'GET', 
       url: 'ajax2.php', 
       data: { 'another_selection' : $selection2 }, 
       success: function(data) { 
        console.log(data); 
        $("#div2").html(data); 
       } 
       }); 
      } 
     }); 

    }); 
}); 
</script> 

Ousideコールバック：

<script> 
$(document).ready(function(){ 
    $(".header").on("click", function(){ 
     var $selection = 'data to be transmitted'; 
     $.ajax({ 
      type: 'GET', 
      url: 'ajax.php', 
      data: { 'selection' : $selection }, 
      success: function(data) { 
       $("#div1").html(data); 
      } 
     }); 
      if ($selection == something) 
       var $selection2 = 'depends on $selection from ajax.php'; 
       $.ajax({ 
       type: 'GET', 
       url: 'ajax2.php', 
       data: { 'another_selection' : $selection2 }, 
       success: function(data) { 
        console.log(data); 
        $("#div2").html(data); 
       } 
       }); 

    }); 
}); 
</script> 

コールバックインサイド

しかし、ajax.phpルーチンとajax2.phpルーチンを1つに統合し、よりクリーンなスクリプトを開発するのが最善の方法です。

あなたのPHPに

<script> 
$(document).ready(function(){ 
    $(".header").on("click", function(){ 
     var $selection = 'data to be transmitted'; 
     if ($selection == something) 
      var $selection2 = 'selection2 data/condition that depends selection'; 
     $.ajax({ 
      type: 'GET', 
      url: 'ajax.php', 
      data: { 
       'selection': $selection, 
       'anotherselection': $selection2   
       }, 
      success: function(data) { 
       $("#div1").html(data); 
       $("#div2").html(data); 
      } 
     }); 

    }); 
}); 
</script> 

：

<?php 
if (isset($_GET['selection'])){ 
    //first ajax routine 
} 

if (isset($_GET['anotherselection'])){ 
    //second ajax routine (ajax2.php) 
}