一：以Ajax的方式显示数据

我们都知道，如果用Ajax程序去加载一个动态页，则加载的实际上是这个动态页执行完毕后生成的静态HTML代码字符串。

1.以原有的格式显示数据

<?php

header("Content-type: text/html; charset=gb2312");

include('conn.php');

$result=$conn->query("Select * From lyb limit 4 ");

while($row=$result->fetch_assoc()){

     echo "<tr><td>".$row['title']."</td>";

     echo "<td>".$row['content']."</td>";

     echo " <td>".$row['author']."</td>";

     echo " <td>".$row['email']."</td>";

     echo "<td>".$row['ip']."</td></tr>";

}

?>
<html>

<head>

    <title>以Ajax方式显示数据</title>

 <script src="jquery.min.js"></script>

 <script>

$(function(){            //页面载入时执行

    $.post("10-1.php", function(data){

            $("#disp").append(data);

          //  alert(data);        //仅作测试，看服务器端数据是否已传来

        });

        } )

</script>

</head>

<body>

<h2 align="center">以Ajax方式显示数据</h2>

<table border="" width="100%"><tbody id="disp"><tr bgcolor="#e0e0e0">

        <th>标题</th> <th>内容</th> <th>作者</th>

        <th>email</th> <th>来自</th>

    </tr></tbody></table>

</body>

</html>

　　2.以自定义的格式显示数据。

2.1返回JSON格式的字符串，将JSON数据以需要的格式显示。

<?

header("Content-type: text/html; charset=gb2312");

include('conn.php');

$result=$conn->query("Select * From lyb limit 4 ");

echo '[';

$i=;

while($row=$result->fetch_assoc()){
?>

 　　　　{title:"<?= $row['title'] ?>",

        content:"<?= $row['content'] ?>",

        author:"<?= $row['author'] ?>",

        email:"<?= $row['email'] ?>",

        ip:"<?= $row['ip'] ?>"}

<?

if($result->num_rows!=++$i) echo ',';    //如果不是最后一条记录

}

echo ']'

?>

2.2按指定的特殊字符串格式输出一条记录，将返回的数组转换成字符串 implode（'|',$row）;然后使用split（'|'）分割该字符串得到一个数组。

<?

header("Content-type: text/html; charset=gb2312");

include('conn.php');

$result=$conn->query("Select * From lyb limit 4 "); 

　　$row=$result->fetch_assoc();

　　$str=implode('|',$row);//将数组各元素用“|”连接起来

　　echo $str;        //输出用“|”分隔的特殊字符串

?>
<html>

<head>

    <title>分割一条记录中的数据</title>

    <script type="text/javascript" src="jquery.min.js"></script>

    <script>

$(function(){            //页面载入时执行

   $.get("10-3.php", function(data) {

      str=data.split("|");

      var tr = "<tr><td>" + str[]+ "</td><td>" + str[]+ "</td><td>" + str[] + "</td><td style='color:red'>" + str[] + "</td><td>" + str[] + "</td></tr>";

      $("#disp").append(tr);

  });

})    

</script>

</head>

<body>

    <h3 align="center" style="margin:4px">分割显示一条记录中的数据</h3>

    <table border="" width="95%" id="disp"><!--载入10-.asp的容器元素-->

      <tr bgcolor="#e0e0e0">

        <th>标题</th> <th width="">内容</th> <th width="">作者</th>

        <th>email</th> <th width="">来自</th>

    </tr>

</table>

</body>

</html>

二、以Ajax方式查询数据

1、无刷新查询数据的实现

HTML代码如下：

<form action="#" method="get">

                 <div style="border:1px solid gray; background:#eee;padding:4px;">

                     查找信息：请输入关键字 <input name="keyword" id="keyword" type="text">

                     <select name="sel" id="sel">

                         <option value="sceNo">景点编号</option>

                         <option value="sceName">景点名称</option>

                         <option value="sPrice">景点价格</option>

                         <option value="author">发布人员</option>

                     </select>

                     <input type="button" id="Submit" value="查询">

                     <a href="index1.php">添加记录</a>

                     <a href="show_scenery.php">返回</a>

                 </div>

             </form>

            <div id="disp"></div>

             <script type="text/javascript">

                     $(function(){

                         $("#Submit").click(function(){

                             var keyword = $("#keyword").val();//得到下拉菜单中的选中项的value值

                             var sel = $("#sel").val();

                             alert(keyword);

                             if (keyword != ) {

                                 $.get("search_scenery.php",{keyword:keyword,sel:sel,sid:Math.random()},function(data){

                                     $("#disp").html(data);

                                 });

                             } else{$("#disp").html("搜索内容不能为空")};

                         });

                     });

             </script>

php文件：

$result = mysql_query("select * from `scenery`",$conn);

 $keyword =(trim($_GET['keyword']));

 $sel=($_GET['sel']);//获取选择的查询类型

      /*$keyword=trim($_GET['keyword']);//获取输入的关键字

     $sel=$_GET['sel'];//获取选择的查询类型*/

     $sql="select * from `scenery`";

     if ($keyword<>"") {

         $sql=$sql ." where $sel like '%$keyword%'";    //构造查询语句

     }

     $result=mysql_query($sql) or die('执行失败');

     if (mysql_num_rows($result)>) {

         echo "<p>关键字为“ $keyword ”，共找到".mysql_num_rows($result)." 条记录</p>";

         echo "<a href='show_scenery.php'>返回</a>";

  ?>

         <!DOCTYPE html>

         <html lang="en">

         <head>

             <meta charset="UTF-8">

             <title>查询结果</title>

         </head>

         <body>

        <form action="?del=1" method="post">

             <table border="">

                 <tr bgcolor="#ccc" >

                     <th>景点编号</th>

                     <th>景点名称</th>

                     <th>景点描述</th>

                     <th>景点价格</th>

                     <th>发布人员</th>

                     <th>发布时间</th>

                     <th>删除</th>

                     <th>更新</th>

                 </tr>

                 <?php

                 while ($row = mysql_fetch_assoc($result)) {

                     ?>

                     <tr>

                         <td><?= $row['sceNo']?></td>

                         <td><?= $row['sceName']?></td>

                         <td><?= $row['sceDesc']?></td>

                         <td><?= $row['sPrice']?>元/人</td>

                         <td><?= $row['author']?></td>

                         <td><?= $row['createtime']?></td>

                         <td><input type="checkbox" name="selected[]" id="" value="<?= $row['sceNo']?>"></td><!-- 删除的复选框 -->

                         <td><a href="edit_scenery.php?sceNo=<?= $row['sceNo']?>">更新</a></td>

                     </tr>

                     <?php

                 }

             }else echo "<script>alert('没有搜索到任何记录!');location.href='show_scenery.php'</script>";

             ?>

             <tr bgcolor="#ddd">

                 <td></td>

                 <td></td>

                 <td></td>

                 <td></td>

                 <td></td>

                 <td></td>

                 <td><input type="submit" value="删 除"></td><!-- 删除按钮 -->

                 <td></td>

             </tr>

         </table>

         </form>

         <p>共有<?= mysql_num_rows($result) ?>条记录 </p>

以Ajax的方式访问数据库的更多相关文章

  1. 非链接方式访问数据库--查询的数据集用Dataset来存储。

    private void Button_Click_1(object sender, RoutedEventArgs e) { //非链接方式访问数据库, //1创建连接对象(连接字符串) using ...

  2. ADO.NET 连接方式和非链接方式访问数据库

    一.//连接方式访问数据库的主要步骤(利用DataReader对象实现数据库连接模式) 1.创建连接对象(连接字符串) SqlConnection con = new SqlConnection(Co ...

  3. php 面向对象的方式访问数据库

    <body> <?php //面向对象的方式访问数据库 //造对象 $db = new MySQLi("localhost","root",& ...

  4. 对比传统方式访问数据库和SpringData访问数据库

    我们在写代码的时候应该一边写一边测试,这样的话可以尽快的找到错误,在代码写多了之后去找错误的话不容易给错误定位 传统方式访问数据库 1:创建一个Maven web项目 2:修改pom.xml为以下内容 ...

  5. ASP.NET MVC- EF返回连接池用ADO.NET方式访问数据库

    用习惯了ADO.NET的方式去访问数据库,虽然ADO.NET写的代码没有EF简洁,可是也并不麻烦.而且EF在进行多表查询的那种方式是,EF需要先去数据库里定义外键,再进去一次代码生成,然后才能用INC ...

  6. 2017.11.12 web中JDBC 方式访问数据库的技术

    JavaWeb------ 第四章 JDBC数据库访问技术 在JavaWeb应用程序中数据库访问是通过Java数据库连接(JavaDateBase Connectivity简称JDBC)数据库的链接一 ...

  7. Mybatis基于注解的方式访问数据库

    1. 使用方式:在Service层直接调用 package com.disappearwind.service; import org.springframework.beans.factory.an ...

  8. 封装类的方式访问数据库(封装字符串、json)

    <?php class DBDA { public $host="localhost";//服务器地址 public $uid="root";//用户名 ...

  9. 使用Tomcat数据源的方式访问数据库(MySql) --Struts2框架应用与开发

    1.为方便测试首先创建数据库和表,然后插入测试数据   2.打开Tomcat服务器安装目录的conf/下的context.xml,配置context.xml文件. 在<Context>标签 ...

随机推荐

  1. hdu3123GCC

    Problem Description The GNU Compiler Collection (usually shortened to GCC) is a compiler system prod ...

  2. I - Long Distance Racing（第二季水）

    Description Bessie is training for her next race by running on a path that includes hills so that sh ...

  3. js Array 学习

    摘抄自<JavaScript权威指南> 1.join()返回生成的字符串.数组元素转化为字符串,拼接.默认分隔符:“,”. 2.reverse()返回逆序的数组,替换.数组中的元素倒序. ...

  4. C函数指针简单用例

    (1)函数指针:可以指向 一类 固定形参类型和返回值类型 的函数 的指针声明:int fun(int, int)    ||    \/int (*pfun)(int, int) pfun就是函数指针 ...

  5. Git学习02 －－暂存区，撤销修改，删除文件

    工作区和暂存区概念: 工作区(Working Directory)就是你在电脑里能看到的目录. 版本库(Repository) 工作区有一个隐藏目录.git,这个不算工作区,而是Git的版本库. Gi ...

  6. Sysstat性能监控工具包中20个实用命令

    Sysstat性能监控工具包中20个实用命令 学习mpstat, pidstat, iostat和sar等工具,这些工具可以帮组我们找出系统中的问题.这些工具都包含了不同的选项,这意味着你可以根据不同 ...

  7. 【hihocoder 1249 Xiongnu's Land】线性扫描

    2015区域赛北京赛区的三水,当时在赛场上没做出的原因是复杂度分析不正确导致把方法想复杂了.近来复习复杂度分析,觉得不能只是笼统地看渐进复杂度(big-O),更应根据算法的伪码计算真正的以基本操作数为 ...

  8. C#字典Dictionary排序（顺序、倒序）

    这里是针对.NET版本过低的排序方式,没怎么用过,记录一下: 一.创建字典Dictionary 对象 假如 Dictionary 中保存的是一个网站页面流量,key 是网页名称,值value对应的是网 ...

  9. Sqlparameter防SQL注入

    一.SQL注入的原因 随着B/S模式应用开发的发展,使用这种模式编写应用程序的程序员也越来越多.但是由于这个行业的入门门槛不高,程序员的水平及经验也参差不齐,相当大一部分程序员在编写代码的时候,没有对 ...

  10. SVN连接不上

    某次我们部门换了场地.SVNserver就连接不上了,后来公司数据中心处理好后,还是连接不上,原来还需刷新自己电脑的DNS. 如需转载,请注明出处http://blog.csdn.net/combat ...