繁体   English   中英

ajax请求不返回数据

[英]ajax request doen't return data

单击div后,我尝试更改数据,但未更改结果

JS代码

$(document).ready(function() {

    $('#piso .caixa').click(function() {
        var valorpiso = $(this).text();
        alert(valorpiso);
        $.ajax({
            type:"post",
            url:"getpiso.php",
            data:"npiso="+valorpiso,
            sucess:function(data){
                $("#caixas").html(data);
            }
        });
     });

});

警报正在打印正确的值

PHP代码

 $piso1=$_POST["npiso"];

 $result=mysql_query("select * FROM rooms where floor='$piso1' ");
 while($dados=mysql_fetch_array($result)){
     echo "<div id='caixa'>";
     echo "<p>$dados[block].$dados[floor].$dados[room]</p>";
     echo "</div>";
 }

你能帮助我吗?

这是您的实际代码吗? 回调函数有一个拼写错误:应该是“成功”,而不是“成功”。

success:function(data){
    $("#caixas").html(data);
}

如果那不起作用,请尝试获取有关正在发生的事情的更多信息。 使用某种开发工具来观察ajax响应。 (在Chrome上为CTRL + SHIFT + I)

OBS:您的PHP代码容易受到SQL注入的攻击。 在这里阅读有关它的更多信息: 如何防止PHP中的SQL注入?

有2个问题

1)@Rogerio说的对,您使用了"sucess":正确的方法是"success":

但是现在使用jquery可以使用以下方法:

  • jqXHR.done(function( data, textStatus, jqXHR ) {});

    成功回调选项的替代结构.done()方法替换了不推荐使用的jqXHR.success()方法。 有关实现的详细信息,请参考deferred.done()

  • jqXHR.fail(function( jqXHR, textStatus, errorThrown ) {});

    错误回调选项的替代构造.fail()方法替换了不建议使用的.error()方法。 有关实现的详细信息,请参考deferred.fail()

  • jqXHR.always(function( data|jqXHR, textStatus, jqXHR|errorThrown ) { });

    .always()方法是complete回调选项的替代构造,它取代了不建议使用的.complete()方法。

    响应成功的请求,该函数的参数与.done()的参数相同:data,textStatus和jqXHR对象。 对于失败的请求,参数与.fail()的参数相同:jqXHR对象,textStatus和errorThrown。 有关实现的详细信息,请参考deferred.always()

  • jqXHR.then(function( data, textStatus, jqXHR ) {}, function( jqXHR, textStatus, errorThrown ) {});

    合并了.done().fail()方法的功能,从而允许(从jQuery 1.8开始)对底层Promise进行操作。 有关实现的详细信息,请参考deferred.then()

在以下网址中了解有关内容: http : //api.jquery.com/jquery.ajax/

一种类型,您使用"npiso="+valorpiso ,但未进行编码,而是使用json,例如: { npiso: valorpiso } (jQuery自动编码数据)

2)请勿在HTML中使用重复的ID,此重复的ID应按结果编号显示:

while($dados=mysql_fetch_array($result)){
     echo "<div id='caixa'>";

使用class=代替id=

首先,将Jquery更新到最新版本

使用Javascript:

$.ajax({
    "type": "POST",
    "url": "getpiso.php",
    "data": { "npiso": valorpiso }
}).done(function(data) {
    console.log(data);
    $(".list_caixa").html(data);
}).fail(function(err) {
    console.log("Failed", err);
}).always(function() {
    console.log("complete");
});

“HTML”:

 $piso1=$_POST["npiso"];

 $result=mysql_query("select * FROM rooms where floor='$piso1' ");
 while($dados=mysql_fetch_array($result)){
     echo "<div class='list_caixa'>";
     echo "<p>$dados[block].$dados[floor].$dados[room]</p>";
     echo "</div>";
 }
  • 您应该调试(alert()或console.log()),以检查成功处理程序中是否已正确返回数据,并检查ID为“ #caixas”的元素是否已存在。

的index.php

`

<html>

    <head>

         <script src="//code.jquery.com/jquery-1.10.2.js"></script>
         <script>
            $(function () {
               $('#piso .caixa').click(function () {
                var valorpiso = $(this).text();
                $.ajax({
                    type: "post",
                    url: "getpiso.php",
                    data: "npiso=" + valorpiso,
                    success: function (data) {
                        $("#caixas").html(data);
                    }
                });
            });

        });
       </script>
    </head>
     <body>
       <div id="piso">
        <p class="caixa" style="cursor:pointer;color:red;background-color:#000;padding:10px;">TEST</p>
       </div>
       <div id="caixas">

       </div>
</body>

`

getpiso.php

     <?php
        if($_POST["npiso"]!=null){
            $piso1=$_POST["npiso"];
            echo "<div id='caixa'>";
            echo "<p>".$piso1." RESULT</p>";
            echo "</div>";
        }
        ?>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM