Ajax无法正常工作

时间:2014-02-22 06:53:51

标签: php ajax

使用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);
    }

?>

3 个答案:

答案 0 :(得分: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);
    }

?>

答案 1 :(得分:0)

调试你的脚本。

您是否在$ 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);
        }

    },

答案 2 :(得分:0)

尝试使用具有就绪处理程序的

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