Ajax無法正常工作

Question

使用ajax php輸入密碼時的查找位置。 但是它不能正常工作。 當我們輸入每個密碼時，都會檢查該密碼，然后顯示該地點的結果。

    <label for="pincode">Pin-Code:</label>
  <input name="pincode" type="text" class="text" id="pincode"  />
  <div id="section1"></div>

我將此部分設置為輸入字段。

 <script>
    $(document).ready(function() {  
         $('#pincode').keyup(function() {
                //ajax request
                $.ajax({
                     url: "pincode_check.php",
                    data: {
                        'pincode' : $('#pincode').val()
                    },
                    dataType: 'json',
                    success: function(data) { console.log(data.success);
                        if(data.success){
                            $.each(data.results[0].address_components, function(index, val){
                                 console.log(index+"::"+val.long_name);                         
                                 $('#section1').append( val.long_name+'<br>');
                             });    
                        }       
                    },      
                });
            });
       });


    </script>

這是將數據發送到pincode_check.php的 ajax部分。 我正在做pincode_check.php如下所示。 在這里，傳遞值將獲取$ pincode變量，然后使用maps.google.com查找該地點的對數。 然后找到對應的地方。 該地名將顯示在表單字段下方。 但是它不能正常工作。

     <?php 
    $pincode=$_REQUEST['pincode'];
    $geocode=file_get_contents('http://maps.google.com/maps/api/geocode/json?address='.$pincode.'&sensor=false');
    $response= json_decode($geocode); //Store values in variable
    $lat = $response->results[0]->geometry->location->lat; //Returns Latitude
    $long = $response->results[0]->geometry->location->lng; // Returns Longitude
    $geocode=file_get_contents('http://maps.googleapis.com/maps/api/geocode/json?latlng='.$lat.','.$long.'&sensor=false');
    $data= json_decode($geocode);

    if($data==true)
    { // Check if address is available or not
        $data->results[0]->formatted_address ;   
        $data->success=true;
        echo json_encode($data);
    }
    else {
        $data->success= false;

        echo json_encode($data);
    }

?>

Answer 1

嘗試此操作，錯過了您的Ajax響應success對象。 我已經重寫了代碼，

另外， pincode_check.php

if($data==true)
{ // Check if address is available or not
    $data->result[0]->formatted_address ;   
    $data->success=true;
    echo json_encode($data);
}
else {
    $data->success= false;      
    echo json_encode($data);
}

在HTML中：應該是（ 在html id元素中刪除# ）

<div id="section1"></div>

代替

<div id="#section1"></div>

更新：

    <script>
    $(document).ready(function() {  
         $('#pincode').keyup(function() {
                //ajax request
                $.ajax({
                     url: "pincode_check.php",
                    data: {
                        'pincode' : $('#pincode').val()
                    },
                    dataType: 'json',
                    success: function(data) { console.log(data.success);
                        if(data.success){
                            $.each(data.results[0].address_components, function(index, val){
                                 console.log(index+"::"+val.long_name);                         
                                 $('#section1').append( val.long_name+'<br>');
                             });    
                        }       
                    },      
                });
            });
       });


    </script>

HTML：

  <label for="pincode">Pin-Code:</label>
  <input name="pincode" type="text" class="text" id="pincode"  />
  <div id="section1"></div>

PHP代碼

<?php 
    $pincode=$_REQUEST['pincode'];
    $geocode=file_get_contents('http://maps.google.com/maps/api/geocode/json?address='.$pincode.'&sensor=false');
    $response= json_decode($geocode); //Store values in variable
    $lat = $response->results[0]->geometry->location->lat; //Returns Latitude
    $long = $response->results[0]->geometry->location->lng; // Returns Longitude
    $geocode=file_get_contents('http://maps.googleapis.com/maps/api/geocode/json?latlng='.$lat.','.$long.'&sensor=false');
    $data= json_decode($geocode);

    if($data==true)
    { // Check if address is available or not
        $data->result[0]->formatted_address ;   
        $data->success=true;
        echo json_encode($data);
    }
    else {
        $data->success= false;

        echo json_encode($data);
    }

?>

Answer 2

調試腳本。

您是否在$ pincode變量中獲取數據？

var_dump($pincode);

我更喜歡在ajax請求中使用定義的方法，例如post：

$.ajax({
    url: "pincode_check.php",
    method: 'POST'
    data: {
        'pincode' : $('#pincode').val()
    },
    dataType: 'json',
    success: function(data) {
        if(data.success ==true){
            $('#section1').html(data.address_components);
        }

    },

});

您的成功函數已經有響應，無需使用條件：

if(data.success ==true){
            $('#section1').html(data.address_components);
        }

嘗試調試它以了解您要接收的數據：

success: function(data) {
           console.log(data);
        }

    },

Answer 3

試試這個有一個准備好的處理程序

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {

 $('#pincode').live('change', function() {
    //ajax request
    $.ajax({
        url: "pincode_check.php",
        data: {
            'pincode' : $('#pincode').val()
        },
        dataType: 'json',
        success: function(data) {
            if(data.success ==true){
                $('#section1').html(data.address_components);
            }

        },

    });
});




  });
</script>