2016-11-17 33 views
4

我试图通过ajax在我的html页面上使用php从API获取数据,当我尝试使它直接链接它工作成功,但是当我尝试在我的drop上使用ajax调用它时下来,这就像没有打电话AJAX ..ajax不会在PHP中调用下拉后作出响应

这里是我的html

<head> 
    <link rel="stylesheet" type="text/css" href="css/normalize.css"> 
    <link rel="stylesheet" type="text/css" href="css/skeleton.css"> 
     <script type="text/javascript" src="js/jquery-2.1.3.min.js"> 
     </script> 
     <script type="text/javascript" src="js/script.js"></script> 
     <title>Penggunaan API RajaOngkir | IDMore</title> 
</head> 
<body> 
    <div class="container"> 
    <div class="row"> 
     <br /> 
     <div class="twelve columns"> 
     <h1>Hitung Ongkos Kirim</h1> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="twelve columns"> 
     <h5>Masukan Data</h5> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="two columns">Asal 
     <br /> 
     <select id="oriprovince"> 
     <option>Province</option> 
     </select></div> 
     <div class="two columns"> 
     <br /> 
     <select id="oricity"> 
      <option>Kota</option> 
     </select> 
     </div> 
     <div class="two columns">Tujuan 
     <br /> 
     <select id="desprovince"> 
     <option>Provinsi</option> 
     </select></div> 
     <div class="two columns"> 
     <br /> 
     <select id="descity"> 
      <option>Kota</option> 
     </select> 
     </div> 
     <div class="two columns">Layanan 
     <br /> 
     <select id="service"> 
     <option>JNE</option> 
     <option>POS</option> 
     <option>TIKI</option> 
     </select></div> 
     <div class="two columns"> 
     <br /> 
     <button id="btncheck">Cek Harga</button> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="twelve columns"> 
     <h5>Harga</h5> 
     </div> 
     <hr /> 
     <table class="twelve columns"> 
     <tr> 
      <th>Servis</th> 
      <th>Deskripsi Servis</th> 
      <th>Lama Kirim (hari)</th> 
      <th>Total Biaya (Rp)</th> 
     </tr> 
     <span id="resultsbox"> 
      <tr> 
      <td>...</td> 
      <td>...</td> 
      <td>...</td> 
      <td>...</td> 
      </tr> 
      <tr> 
      <td>...</td> 
      <td>...</td> 
      <td>...</td> 
      <td>...</td> 
      </tr> 
     </span> 
     </table> 
    </div> 
    </div> 
</body> 

这里是我的JavaScript。

$(document).ready(function() { 
    loadProvinsi('#oriprovince'); 
    loadProvinsi('#desprovince'); 
    $('#oriprovince').change(function() { 
     alert('yussan'); 
    }); 
    $('#desprovince').change(function() { 
     alert('yussan'); 
    }); 
}); 

function loadProvinsi(id) { 
    $('#oricity').hide(); 
    $('#descity').hide(); 
    $(id).html('loading...'); 
    $.ajax({ 
     url: 'process.php?act=showprovince', 
     dataType: 'json', 
     success: function(response) { 
      $(id).html(''); 
      province = ''; 
      $.each(response['rajaongkir']['results'], function(i, n) { 
       province = '<option value="n[province_id]">'+n['province']+'</option>'; 
       <option></option> 
       province = province + ''; 
       $(id).append(province); 
      }); 
     }, 
     error: function() { 
      $(id).html('ERROR'); 
     } 
    }); 
} 
+0

什么''里面的脚本? – Banzay

+0

我希望触发我从api数据获得的省名称列表? –

+0

你的浏览器控制台有什么错误,如果有的话? –

回答

5
$.each(response['rajaongkir']['results'], function(i, n) { 
       var option = '<option value="'+n['province_id']+'">'+n['province']+'</option>'; 
       province += option; 
      }); 
       $(id).append(province); 

请与本code.And再试一次更换你的每一个功能。

+0

你认为'省=省+'''有用吗?你为什么在循环之外放置'$(id).append(province);'? – Banzay

+0

经过变更后,您所做的省份只包含最后一项结果的两倍。因为它包含一个错误,所以我放弃了你的答案。 – Banzay

+0

@Banzay现在是否正确? –