Php 使用AJAX加载查询_Php_Ajax

Php 使用AJAX加载查询

php ajax

Php 使用AJAX加载查询,php,ajax,Php,Ajax,我从一个网站上得到了这个脚本，它与此配套 function showUser(str) { if (str=="") { document.getElementById("content").innerHTML=""; return; } if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onr

我从一个网站上得到了这个脚本，它与此配套

function showUser(str) {
if (str=="") {
document.getElementById("content").innerHTML="";
return;
} 
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
} else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("content").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","paginas.php?q="+str,true);
xmlhttp.send();
}

我也用了这个：

<?php
$q = htmlspecialchars($_GET['q']);

$con = mysqli_connect('localhost','root',NULL,'ttrpg');
if (!$con) {
  die('Could not connect: ' . mysqli_error($con));
}

mysqli_select_db($con,"ajax_demo");
$sql="SELECT * FROM content WHERE Pagina = '".$q."' ORDER BY ID ASC";
$result = mysqli_query($con,$sql);

while($row = mysqli_fetch_array($result)) {
  echo '<div class="container">';
  echo $row['Text'];
  echo "</div>";
}
echo "</table>";

mysqli_close($con);
?>

我没有更改函数的名称，因为没有必要这样做我遇到的问题是，当我加载页面时，div中没有显示任何内容。

当我按下一个链接，例如

onclick=“showUser（'Apple'）”

时，div中的文本会发生变化，但从

主页

中的文本不会消失，除非我重新加载页面

如果您想在页面加载时加载脚本，您可以使用

<body onload="showUser('Home')">

您还可以使用firefox的firebug或chrome的开发者工具使用inspect元素查看整个ajax标题、发送的参数和响应，然后转到nework，它将显示ajax请求和响应

此外，您还可以在ajax php文件中使用print\r（$\请求）

编辑：我已经使用ajax编写了满足您需求的代码。一旦页面从表内容获取记录加载，这将调用主页内容。若您单击“关于”按钮，它将从内容表中获取关于页面的内容

  echo $sql="SELECT * FROM content WHERE Pagina = '".$q."' ORDER BY ID ASC";


.msg{color:#ff0000；}
#contentloader{背景色：fff；边框：1px实心#333；填充：10px；}
函数ajaxContentLoad（第页）{
q={
“页面”：页面，
}
$.ajax({
类型：'post'，
数据：q，
url:'ajaxData.php'，
beforeSend:function（）{
$（“#msg”）.text（“向服务器发送请求…”）；
},
完成：函数（）{
$（“#msg”）.text（“已接收并加载请求”）；
},
成功：函数（结果、文本状态、jqXHR）{
$（“#contentloader”）.html（结果）；
},
错误：函数（jqXHR、textStatus、errorshown）{
警报（错误抛出）；
}
})
}
$（）.ready（功能（e）{
ajaxContentLoad（“主页”）；
})
家
关于

页面加载上的内容

这里是ajaxData.php文件

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title></title>
    <meta name="" content="">
    <style>.msg{ color:#ff0000;}
    #contentloader{ background-color:#fff; border:1px solid #333; padding:10px; }
    </style>
    </head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <script>

    function ajaxContentLoad(page){
            q = {
                'page':page,
            }
            $.ajax({
                type:'post',
                data:q,
                url:'ajaxData.php',
                beforeSend: function(){
                    $("#msg").text("sending request to server...");
                },
                complete:function (){
                    $("#msg").text("request received and loaded");
                },
                success:function(result, textStatus, jqXHR) {                       
                    $("#contentloader").html(result);
                },
                error: function(jqXHR, textStatus, errorThrown){
                    alert(errorThrown);
                }
            })
}
$().ready(function(e){
    ajaxContentLoad('Home');
})

    </script>
    <body>
        <div style="padding: 20px; margin:20px auto; width:80%; background: #eee">
        <button id="btn1" value="Home" onclick="ajaxContentLoad('Home');">Home</button>
        <button id="btn1" value="About" onclick="ajaxContentLoad('About');">About</button>
        <p id="msg" class="msg"></p>

            <div id="contentloader">
                Content on page load
            </div>
        </div>
    </body>
    </html>

您确定表中有一行，其中Pagina='Home'？有两行，它会回显这些内容当PHP脚本不回显表行时，它会回显哪些内容？我不知道这怎么会导致您描述的问题，但这显然是错误的。它确实解决了页面加载时不显示任何内容的问题，但它会一直显示主页如果只有一行，则无需使用while循环。确保您的查询通过使用print\r（$row）打印其输出返回任何行；它有时会返回多行，我将echo更改为print_r（），但我仍然无法通过单击任何按钮来更改内容我使用名为“container”的元素，有时每页会有更多的元素；）但是，我仍然无法通过单击任何按钮来更改内容：P
  echo $sql="SELECT * FROM content WHERE Pagina = '".$q."' ORDER BY ID ASC";

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title></title>
    <meta name="" content="">
    <style>.msg{ color:#ff0000;}
    #contentloader{ background-color:#fff; border:1px solid #333; padding:10px; }
    </style>
    </head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <script>

    function ajaxContentLoad(page){
            q = {
                'page':page,
            }
            $.ajax({
                type:'post',
                data:q,
                url:'ajaxData.php',
                beforeSend: function(){
                    $("#msg").text("sending request to server...");
                },
                complete:function (){
                    $("#msg").text("request received and loaded");
                },
                success:function(result, textStatus, jqXHR) {                       
                    $("#contentloader").html(result);
                },
                error: function(jqXHR, textStatus, errorThrown){
                    alert(errorThrown);
                }
            })
}
$().ready(function(e){
    ajaxContentLoad('Home');
})

    </script>
    <body>
        <div style="padding: 20px; margin:20px auto; width:80%; background: #eee">
        <button id="btn1" value="Home" onclick="ajaxContentLoad('Home');">Home</button>
        <button id="btn1" value="About" onclick="ajaxContentLoad('About');">About</button>
        <p id="msg" class="msg"></p>

            <div id="contentloader">
                Content on page load
            </div>
        </div>
    </body>
    </html>

    <?php
        $q = htmlspecialchars($_REQUEST['page']);

        $con = mysqli_connect('localhost','root',admin,'demo');
        if (!$con) {
          die('Could not connect: ' . mysqli_error($con));
        }

        mysqli_select_db($con,"demo");

        $sql="SELECT * FROM tbl_content WHERE page = '".$q."' ORDER BY ID ASC";
        $result = mysqli_query($con,$sql);

        while($row = mysqli_fetch_array($result)) {
          echo '<div class="container">';
          echo $row['content'];
          echo "</div>";
        }

    mysqli_close($con);