跟着老师做的个简单的百度一下



1.搭配环境
 导包到lib目录下
 jar包有：
 mysql-connector 用来连接数据库
 c3p0和mchange-commons 数据库连接常量池
 常量池配置文件c3p0-config.xml
2.创建项目
 创建的项目包有:
 utils
 servlet
 在WebContent下写html网页
3.数据库创建
create database word;
 use word;
 create table title(
  id int primary key auto_increment comment '标题的编号',
  name varchar(32) not null comment '标题的名字'
 )
4.代码
1.uitls下的创建DbUtils_c3p0工具类
  * 1.静态方法  加载驱动 读取配置文件
  * 2.获取链接
  * 3.关闭资源
  * 4.数据的增删改 executeUpdate
 //加载驱动，读取配置文件c3p0-config
 public class DbUtils_c3p0{
  private static ComboPooledDataSource cpd=null;
 static {
  cpd=new ComboPooledDataSource("mysql");
 }

 //获得连接
 public static Connection getConnection() throws Exception{
 if(cpd!=null){
  return cpd.getConnection();
    }
return null;
  }

 //关闭资源
 public static void release(ResultSet rSet,Statement statement,Connection connection){
 if(rSet!=null){
  try{
  rSet.close();
      }catch(SQLException e){
 e.printStackTrace();
        }
    }if(statement!=null){
  try{
  statement.close();
      }catch(SQLException e){
 e.printStackTrace();
        }
    }
 if(connection!=null){
  try{
  connection.close();
      }catch(SQLException e){
 e.printStackTrace();
        }
     }
  }

//对数据库的增删改
 public static int executeUpdate(String sql,Object...params){
 Connection connection=null;
 PreparedStatement pStatement=null;
 try{
 //建立数据库连接
 connection=getConnction();
 //创建命令对象
 pStatement=connection.prepareStatement(sql);
 //通过循环将数据放进去
 for( int i=0;i<params.length;i++){
 pStatemment.setObject(i+1,params[i]);
      }
 //执行
 int result=pStatement.executeUpdate();
return result;
    }catch(Exception e){
 throw new RuntimeException(e);
    }finally{release(null,pStatement,connection);}
  }

}

配置文件c3p0-config.xml

<?xml version="1.0" encoding="utf=8"?>
<c3p0-config>
 <named-config name="mysql">
  <property name="driverClass">com.mysql.jdbc.Driver</property>
  <property name="jdbcUrl">jdbc:mysql://locahost:3306/word</property>
  <property name="user">root</property>
  <property name="password">root</property>

  <property name="acquireIncrement">5</property>
  <property name="initialPoolSize">10</property>
  <property name="minPoolSize">5</property>
  <property name="maxPoolSize">30</property>
 </named-config>
</c3p0-config>

2.servlet下创建DataServlet服务器类
//设置浏览器和服务器的编码
request.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");

//获得浏览网页输入的请求的数据
String value=request.getParameter("value");

//连接数据库
Connection connection=null;
PreparedStatement pStatement=null;
ResultSet rSet=null;
try{
 connection=DbUtils_c3p0.getConnection();
//查询语句查询数据库中数据
pStatement=connection.prepareStatement("select name from title where name like ?");
//模糊查询
pStatement.setString(1,"%"+value+"%");
rSet=pStatement.executeQuery();

//将查询的结果以字符串缓存
StringBuffer sb=new StringBuffer();
while(rSet.next()){
 String name=rSet.getString("name");
 sb.append("");//以空格隔开，以便切分词组
 sb.append(name);
  }

 response.getwriter.write(sb.toString);//在浏览的页面输出。toString将对象转为字符串形式
}catch(Exception e){
 e.printStackTrace();
  }finally{
 DbUtils_c3p0.release(rSet,pStatement, connection)
  }

3.html网页
//设置格式样式

<script type="text/javascript" src="ajax.js"></script>
<style type="text/css">
  #box{
  
   border:1px solid #c3c3c3;
   width:200px;
   display:none;
  
  } 

</style>
//网页的布局显示

<center>
  <img alt="baidu" src="baidu.png" width="300">
  <div id="div">
   <input id="search" type="text" name="baidu" οnkeyup="ipChange(this)"/><button >百度一下</button>
   <div id="box">
   
   </div>
  </div>
 </center>
 

//网页事件的处理
<script type="text/javascript">
//创建ajax即实例化XMLHttpRequest
var ajax=getAjax();
var box=document.getElementById("box");

//监听输入的内容，触发该方法
function ipChange(ip){
 var value=ip.value;
 //清空
 box.innerHTML="";
 if(value!=null&& value!=""){
 //ajax监听
 ajax.onreadystatechange=function(){
 if(ajax.readyState==4&&ajax.status==200){
 var result=ajax.responseText;
 if(result==null&&result==""){
 box.style.display="none";
             }else{
 box.style.display="block";
              }
 //字符串的分割，用数组存储
 var arr=result.split(" ");
 for(index in arr){
  var text=arr[index];
  var boxChild=document.createElement("div");
  var textNode=document.createTextNode(text);
  boxChild.appendChild(textNode);
  box.appendChild(boxChild);
             }
           }
        }
 //设置路径
ajax.open("get","/baidu-18/DataServlet?value="+value,true);
 //发送请求
 ajax.send();
     }else{
box.style.display="none";}
  }

</script>

//ajax方法的封装为 (文件名)ajax.js
function getAjax(){
//创建ajax即实例化XMLHttpRequest
 var xmlhttp;
 if(window.XMLHttpRequest){
 xmlhttp=new XMLHttpRequest();
  }else{
 xmlhttp=new ActiveXObject("Mricrosoft.XMLHTTP");
    }
 return xmlhttp;
}