jQuery, $.post() 不访问目标网址

jQuery, $.post() not accessing target url

本文关键字:访问 目标 post jQuery      更新时间:2023-09-26

在下面的代码中,有一个XMLHTTPRequest,目标网址test_location_jquery.php,尽管触发了成功函数,但永远不会访问这个文件。单独运行时进行测试时,test_location_jquery.php已成功按预期返回 JSON 对象。任何关于如何在不访问文件时触发成功函数的想法将不胜感激。

简讯

<?php
    require_once '../meta/php/dbConn.php';
    $charlie_query = "";
    $charlie_result = "";
    $charlie_query = "
        SELECT  ud.user_id as 'id',
                concat(ud.last_name,', ',ud.first_name) as 'name'
        FROM    `user_detail` AS ud,
                `user_type` AS UT
        WHERE ud.user_type = ut.id
        AND ut.class IN ('charlie')
        AND ut.level IN (4)
        ORDER BY ut.class;
    ";
    $charlie_result = mysql_query($charlie_query);
    
    if(!(bool)$charlie_result){
        throw new Exception();
    }
?>
<html>
<head>
    <script src="../meta/js/jquery-1.7.2.js"></script>
<!-- <script src="../meta/js/getXML_sir.js"></script>  -->
    <script>
        $(document).ready(function(){
            $('#charlie').change(function(){
                var charlie_id =  $('#charlie option:selected').val();
                var DT = "json";
                $.post(
                        'test_location_jquery.php',
                        {'id':charlie_id,'datatype':DT},
                        function(data){
                            alert('Success');
                            var obj = $.parseJSON(data);
                        }
                );
                
                if(obj != 'undefined'){
                    var locations = obj.find('location');
                    console.log(locations);
                }else{
                    alert("failure");
                }
            })
        })
            
    </script>
</head>
<body>
    <form>
        <label>Charlie: </label><select id="charlie" name="charlie">
            <option>&nbsp;</option>
        <?php
            while($row = mysql_fetch_assoc($charlie_result)){
                print("<option value='".$row['id']."'>".$row['name']."</option>");
            } 
        ?>
        </select>
        <label>Location: </label><select id="location" name="location"></select>
    </form>
    
    <div></div>
    
</body>
</html>

test_location_jquery.php

<?php
require_once("../meta/php/dbConn.php");
if(!isset($_POST)){
    throw new Exception();
}else{
    $id = $_POST['id'];
    $datatype = $_POST['datatype'];
}
$query = "
        SELECT  l.id as 'id',
            ld.attribute_string as 'name'
        FROM    `location` AS l,
                `location_details` AS ld
        WHERE l.id = ld.location_id
        AND     ld.attribute_label = 'name'
        AND l.id = ".$id.";
";
$result = mysql_query($query);
if(!(bool)$result){
    throw new Exception();
}else{
    switch($datatype){
        case 'xml':
        break;
        case 'json':
            $rows = array();
            while($r = mysql_fetch_assoc($result)) {
                $rows[] = $r;
            }
            return json_encode($rows);
        break;
}

?>

您的.post()函数是异步的。 这意味着调用.post()只是开始发布。 它后面的行在post()完成之前和调用成功处理程序之前立即执行。

然后,一段时间后调用成功处理程序。

使用来自 post 的响应的所有代码都必须位于成功处理程序中或从成功处理程序调用。

因此,您的问题是您无法引用此代码所在的成功处理程序中的数据集(紧随.post()调用之后)。 您必须将此代码放在成功处理程序本身中。

            if(obj != 'undefined'){
                var locations = obj.find('location');
                console.log(locations);
            }else{
                alert("failure");
            }
因此,完成

此操作后,您的代码将如下所示:

<script>
    $(document).ready(function(){
        $('#charlie').change(function(){
            var charlie_id =  $('#charlie option:selected').val();
            var DT = "json";
            $.post(
                    'test_location_jquery.php',
                    {'id':charlie_id,'datatype':DT},
                    function(data){
                        alert('Success');
                        var obj = $.parseJSON(data);
                        if(obj != 'undefined'){
                            var locations = obj.find('location');
                            console.log(locations);
                        }else{
                           alert("failure");
                        }
                    }
            );

        })
    })
</script>

这应该有效。

                     $.post(
                        'test_location_jquery.php',
                        {'id':charlie_id,'datatype':DT},
                        function(data){
                            alert('Success');
                            var obj = $.parseJSON(data);
                            if(obj != 'undefined'){
                             var locations = obj.find('location');
                                  console.log(locations);
                             }else{
                                alert("failure");
                             }
                        }
                );

由于 Ajax 是异步的,因此在页面完全调用之前,obj 变量不存在。 因此,如果您将函数(数据)放入其中,则只有在完全调用后才会继续,并且该变量现在将存在。