一:以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. HTML5的结构学习(1) --- 新增的主体结构元素

      1.article 元素 解释:代表文档.页面和应用程序中独立的.完整的.可以被独自引用的内容. 主要用途:博客中的文章.评论,贴吧中的帖子,或者独立的插件等. article中可以包含多种元素例 ...

  2. Python之路第十天,高级(2)-多线程,多进程,协程

    线程 threading threading模块对象 描述 Thread 表示一个线程的执行对象 Lock 锁原语对象 RLock 可重入锁对象,使单线程可再次获得已经获得了的锁(递归锁定) Cond ...

  3. Python 自学笔记(一)环境搭建

    一,关于Python的介绍 关于Python的介绍,我不想多说了,网上随便一搜,很多介绍,这里我主要写下我的自学Python的 过程,也是为了促进我能继续学习下去. 二,环境搭建 1,这里我只讲解Wi ...

  4. MYSQL 查看可用的字符集的 2 方法

    方法 1. show character set; 方法 2. show collation;

  5. Sql Server专题一:索引(中)

    写在前面的废话: 索引这个知识点,我前前后后不知道看了多少边,网上的文章五花八门,搞的我晕头转向,搞的牛逼点的就是测试索引带来的好处,还搞一大堆的测试数据出来,有意思吗?MS自己不会测试吗?这样的测试 ...

  6. python编辑器对比和推荐

    python编辑器对比和推荐   我先给一个初步的表格吧,大家如果有什么意见,或有补充,欢迎提出.有些我没有用过,先不写了.以下是我使用过的python IDE: 除了PythonWin, Visua ...

  7. IPicture总结

    1.利用IPicture接口加载.显示图片 IPicture接口管理一个图片对象和它的属性.图片对象提供对Bitmap Icon Metafile的语言不相关的抽象支持.图像对象的主要接口是IPict ...

  8. hdu 1150 Machine Schedule hdu 1151 Air Raid 匈牙利模版

    //两道大水……哦不 两道结论题 结论:二部图的最小覆盖数=二部图的最大匹配数 有向图的最小覆盖数=节点数-二部图的最大匹配数 //hdu 1150 #include<cstdio> #i ...

  9. [Linux] rlwrap - 解决Linux下sqlplus退格、上翻键乱码问题

    在Linux下使用sqlplus你会发现:退格键无法正常使用(乱码),上翻键也无法正常显示历史功能,非常讨厌! 为了让退格键和上翻键在sqlplus里正常发挥它的作用,我们必须安装一个软件 - rlw ...

  10. 小黑小波比.coding的使用

    1_Coding的演示 1_html的演示 1_先查看帮助 1.它支持的语言非常多.下面是链接地址 https://coding.net/u/bobo159357456/p/html/paas/hel ...