`
chengyue2007
  • 浏览: 1497760 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

一个通用的ajax程序(实现像百度一样自动提示功能)

    博客分类:
  • ajax
阅读更多

1.jsp+javabean实现ajax

(1),<script type="text/javascript">
String.prototype.trim=function(){
return this.replace(/(^\s*)|(\s*$)/g, "");
}
//表名ajax
function ajaxTable(){

    var table_name=document.validateRule01.table_name.value;
    if(table_name==""){
     document.getElementById("result_display").style.visibility='hidden';
    return;
    }
var X = new ActiveXObject("MSXML2.XMLHTTP.3.0");
   //var X = new XMLHttpRequest();
   if(X)
   {
   X.onreadystatechange=function(){
    if(X.readyState==4)
    {
     if(X.status==200)
     {
      var mobanhtml=X.responseText;
      mobanhtml=mobanhtml.trim();
     var tableNames = mobanhtml.split(",");
     var s = document.getElementById('result_display') ;
                s.innerHTML = '';  
                if(tableNames.length>0){
                document.getElementById('result_display').style.visibility='visible';
                for(i=0; i < tableNames.length ; i++) {  
                   var suggest = '<div onmouseover="onmouseOver(this);" ';  
                   suggest += 'onmouseout="onmousetOut(this);" ';  
                   suggest += 'onclick="setSuggestValue(this.innerHTML);" ';  
                   suggest += 'class="onmouset_out">' + tableNames[i] + '</div>';  
                   s.innerHTML += suggest;
                }  
                }
     }
     else
     {
      
       }
    }

   };
   
    X.open("POST","getTableName.jsp?table_name="+table_name,true);
    X.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    X.send();
   
   }
   else
   {
    alert("??");
   }
}
function onmouseOver(div) {  
         div.className = 'onmouse_over';  
      }  
      function onmousetOut(div) {  
         div.className = 'onmouset_out';  
      }  
      function setSuggestValue(value) {  
         document.validateRule01.table_name.value = value;  
         document.getElementById('result_display').innerHTML = '';
          document.getElementById("result_display").style.visibility='hidden';
      }    其中红色部分是要修改的部分,其他代码可以照搬

然后是促发这个ajax的text框代码:<input type='text' size='30' style="width:200px" id="txt" name='table_name' value='<%=InitBean.getTable_name()%>' onkeyup="ajaxTable();" >

在这个text框所在的table外面添加<div id="result_display" style="position:absolute; visibility:hidden; overflow:auto; top:70px; left:195px; width:200px; height:200px; background-color:#ffffff;">
           </div>

2.下面是getTableName.jsp的代码:

<%@ page contentType="text/html;charset=gb2312" %>
<%@ page language="java"
session="true"
         buffer="32kb"        
         autoFlush="true"        
%>

<%@ page import="
   com.hoperun.bi.quality.GetTableName,
   java.sql.Connection,
   java.sql.Statement,
   java.sql.ResultSet
   "
%>
<%--
response.setHeader("Cache-Control","no-cache"); //Forces caches to obtain a new copy of the page from the origin server
response.setHeader("Cache-Control","no-store"); //Directs caches not to store the page under any circumstance
response.setDateHeader("Expires", 0);           //Causes the proxy cache to see the page as "stale"
response.setHeader("Pragma","no-cache");        //HTTP 1.0 backward compatibility
--%>

<%
String table_name=request.getParameter("table_name");
GetTableName getTableName=new GetTableName();
String str=getTableName.getTableNames(table_name);

out.write(str);
%>

3.下面是GetTableName.java的bean代码:

/*
* com.hoperun.bi.beans.SqlEditorBean0101.java
*
* Created on 2006-5-22 14:16:59
*
* Version 1.0.0
*
* Copyright 2003-2005 by NanJing HopeRun(IT-FOREST) Information System Co., Ltd, CHINA and
*                        IT Forest Corporation
* All rights reserved.
*
* This software is the confidential and proprietary information of
* HopeRun(IT-FOREST) Information System Co., Ltd, CHINA and IT Forest Corporation.
* You shall not disclose such Confidential Information and shall use it only in
* accordance with the terms of the license agreement you entered into with
* HopeRun(IT-FOREST) Information System Co., Ltd, CHINA and IT Forest Corporation.
*/
package com.hoperun.bi.quality;

import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;

import com.webpump.sdk.datasource.DataSourceManager;

/**
* @author wei_yuhong
*
* 表格中文描述和字段描述定义画面Bean,选择数据源分别编辑
*/
public class GetTableName {

private Connection conn;
public GetTableName() throws SQLException{
   conn=DataSourceManager.findDataSource("").getConnection();
}
/**
* 执行添加、查询等动作的过程。
* @param objIn 保存有执行此操作所需的所有数据
* @param objOut 保存查询等操作的结果数据
*/
public String getTableNames(String table_name) throws SQLException {
   String str="";
   try{
    String sqlmodel = "select t.table_en_name from hpbi_tablestorage t where t.table_en_name like '"+table_name+"%' order by t.table_en_name";
    Statement pStmt = this.conn.createStatement();
    ResultSet rsmodel = pStmt.executeQuery(sqlmodel);
   
    while(rsmodel.next()){
     str+=rsmodel.getString("table_en_name")+",";
    }
   }catch(Exception e){
    System.out.print(e);
   }finally{
     try {
      if (conn!=null) {
        conn.close();
        conn = null;
      }
           } catch (Exception e) {
           }
   }
   return str;
}
}

这样就可以在输入框中输入表名的首字母,就可以自动提示所有以这个字母开头的表名

二.用struts2.0的实现:只要把X.open("POST","getTableName.jsp?table_name="+table_name,true);
中的。getTableName.jsp改成getTableName.action就ok了,还有就是下面的getTableName.action的代码:

package com.hoperun.action;


import java.io.PrintStream;
import java.util.HashMap;

import javax.servlet.http.HttpServletResponse;

import org.apache.struts2.ServletActionContext;

import com.hoperun.service.GetCloseIdService;
import com.hoperun.service.SalesSearchService;
import com.opensymphony.xwork2.ActionSupport;


public class getCloseIdAction extends ActionSupport
{

    /** *//**
     *
     */
    private static final long serialVersionUID = 1L;
   
    /**//*
     */
    private GetCloseIdService getCloseIdService=new GetCloseIdService();
   
    private String clothesid="";
   
   

    public String getClothesid() {
   return clothesid;
}

public void setClothesid(String clothesid) {
   this.clothesid = clothesid;
}

@Override
    public void validate()
    {
    
    }
   
    @Override
    public String execute() throws Exception
    {
        HashMap<String,String> hmInput = new HashMap<String,String>();
       
        String reStr=getCloseIdService.getclothesIds(clothesid);
        HttpServletResponse response = ServletActionContext.getResponse();
        response.setContentType("text/html;charset=GBK");//解决中文乱码
        PrintStream out = new PrintStream(response.getOutputStream());//获取out输出对象
        out.println(reStr);
        return null;//这里返回的是null
    }

}

注意这里action返回的是null,千万记住

分享到:
评论

相关推荐

    JQuery&CSS;&CSS;+DIV实例大全.rar

    4.JS+CSS通用一个页面同时三个焦点图轮换效果完整实例 5.JS+CSS网页版模拟QQ登录框界面特效示例 6.JS+flash立柱广告代码仿百度MP3搜索右侧可伸缩的立柱广告效果 7.JS版本黑色超动感二级菜单导航模块代码 穿越...

    远程debug流程,方便debug

    远程debug流程,方便debug

    基于麻雀生物特性的搜索算法(SSA)的Matlab实现:原理、代码与实战应用,基于圈养麻雀特性的搜索算法(SSA)matlab实现:原理、代码与警觉机制解析,麻雀搜索算法(SSA)的matlab实现

    基于麻雀生物特性的搜索算法(SSA)的Matlab实现:原理、代码与实战应用,基于圈养麻雀特性的搜索算法(SSA)matlab实现:原理、代码与警觉机制解析,麻雀搜索算法(SSA)的matlab实现 原创代码,注释清晰,可直接运行 研究表明,圈养的麻雀存在两种不同类型:发现者和加入者。 发现者在种群中负责寻找食物并为整个麻雀种群提供觅食区域和方向,而加入者则是利用发现者来获取食物。 在生活中我们仔细观察会发现,当群体中有麻雀发现周围有捕食者时,此时群体中一个或多个个体会发出啁啾声,一旦发出这样的声音整个种群就会立即躲避危险,进而飞到其它的安全区域进行觅食。 这样的麻雀被称为警觉者。 麻雀搜索算法就是利用麻雀的这种生物特性进行迭代寻优的优化算法。 本资源包含以下三部分内容: 1.麻雀搜索算法的基本原理(两篇参考文献),非常适合用来学习。 2.麻雀搜索算法的matlab代码,注释详细,结构清晰。 3.五个群智能优化算法常用的测试函数。 ,麻雀搜索算法(SSA); MATLAB实现; 原创代码; 注释清晰; 可直接运行; 生物特性迭代寻优; 发现者与加入者; 警觉者; 参考两篇文献。

    基于java的五子棋游戏设计源码+论文

    基于java的五子棋游戏设计源码+论文

    deepseek-r1使用指南

    deepseek-r1使用指南

    DeepSeek+DeepResearch-让科研像聊天一样简单

    DeepSeek+DeepResearch——让科研像聊天一样简单 (1)DeepSeek如何做数据分析? (2)DeepSeek如何分析文件内容? (3)DeepSeek如何进行数据挖掘? (4)DeepSeek如何进行科学研究? (5)DeepSeek如何写综述? (6)DeepSeek如何进行数据可视化? (7)DeepSeek如何写作润色? (8)DeepSeek如何中英文互译? (9)DeepSeek如何做降重? (10)DeepSeek论文参考文献指令 (11)DeepSeek基础知识。

    基于dlib及opencv的人脸识别.zip

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行,功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    基于人工智能的目标检测应用.zip

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行;功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    DSP28335通过SPI与AD7606八路信号采集与通信的实践:实时数值与波形展示在上位机界面上,DSP28335与AD7606 SPI通信:采集八路信号并通过SCI上送至上位机实现数据及波形显示

    DSP28335通过SPI与AD7606八路信号采集与通信的实践:实时数值与波形展示在上位机界面上,DSP28335与AD7606 SPI通信:采集八路信号并通过SCI上送至上位机实现数据及波形显示,Dsp28335利用spi与ad7606通信,采集八路信号,通过sci发送到到上位机显示数值和波形 ,DSP28335; SPI; AD7606; 八路信号采集; SCI; 上位机显示; 数值和波形,DSP28335 SPI通讯 AD7606 八路信号采集 SCI发送上位机显示

    搭建mario机器学习测试系统,进行机器学习。.zip

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行,功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    marisa-ruby-0.2.4-4.el7.x64-86.rpm.tar.gz

    1、文件内容:marisa-ruby-0.2.4-4.el7.rpm以及相关依赖 2、文件形式:tar.gz压缩包 3、安装指令: #Step1、解压 tar -zxvf /mnt/data/output/marisa-ruby-0.2.4-4.el7.tar.gz #Step2、进入解压后的目录,执行安装 sudo rpm -ivh *.rpm 4、更多资源/技术支持:公众号禅静编程坊

    基于Tent混沌映射的麻雀搜索算法优化:提高全局搜索能力与初始解质量,基于Tent混沌映射的麻雀搜索算法优化:提高全局搜索能力与初始解质量,基于Tent混沌映射的麻雀搜索算法matlab代码: 针对麻

    基于Tent混沌映射的麻雀搜索算法优化:提高全局搜索能力与初始解质量,基于Tent混沌映射的麻雀搜索算法优化:提高全局搜索能力与初始解质量,基于Tent混沌映射的麻雀搜索算法matlab代码: 针对麻雀搜索算法(SSA)在接近全局最优时,种群多样性减少,易陷入局部最优解等问题,提出了一种混沌麻雀搜索优化算法(CSSA)。 通过改进 Tent 混沌序列初始化种群,提高初始解的质量,增强算法的全局搜索能力; ,基于Tent混沌映射的麻雀搜索算法; CSSA(混沌麻雀搜索优化算法); Tent混沌序列初始化种群; 全局搜索能力。,基于Tent混沌映射的CSSA算法:提高麻雀搜索全局搜索能力

    JavaWeb期刊管理系统_课程设计附课设报告.zip

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行,功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    上接战略下接绩效的培训规划.pptx

    上接战略下接绩效的培训规划.pptx

    基于S7-300 PLC和Wincc Flexible触摸屏的温室大棚智能控制解决方案:梯形图程序详解、接线与原理图图谱及组态设计,基于S7-300 PLC与Wincc Flexible触摸屏的温室大

    基于S7-300 PLC和Wincc Flexible触摸屏的温室大棚智能控制解决方案:梯形图程序详解、接线与原理图图谱及组态设计,基于S7-300 PLC与Wincc Flexible触摸屏的温室大棚智能控制解决方案:梯形图程序、接线图与组态画面全解析,No.943 基于S7-300 PLC和Wincc Flexible触摸屏温室大棚控制 带解释的梯形图程序,接线图原理图图纸,io分配,组态画面 ,943; S7-300 PLC; Wincc Flexible触摸屏; 温室大棚控制; 梯形图程序; 接线图原理图; IO分配; 组态画面,S7-300 PLC与Wincc Flexible触摸屏联合打造:No.943温室大棚控制系统的设计与实现

    基于ADMM算法的GAMS程序:发电商竞标策略模型及其应用解析,GAMS程序解析:基于ADMM算法的发电商竞标策略优化模型与代码实现,GAMS程序:ADMM算法-基于ADMM法的发电商竞标策略 本程序

    基于ADMM算法的GAMS程序:发电商竞标策略模型及其应用解析,GAMS程序解析:基于ADMM算法的发电商竞标策略优化模型与代码实现,GAMS程序:ADMM算法-基于ADMM法的发电商竞标策略 本程序主要介绍ADMM算法在GAMS中的编写方式,模型基于发电商竞标策略进行编写,基本包含了文章中的模型,但并非完全复现,可作为参考程序自学使用,也可在程序的基础上进行修改使用。 需要的同学可根据以下图片研究是否为自己需要的程序进行。 也可提供ADMM部分程序。 程序包括两个,分别为解决战略投资问题的广义MILP制定的GAMS代码、基于提出的共识- admm算法解决战略投资问题的GAMS代码 ,GAMS程序; ADMM算法; 发电商竞标策略; 模型编写; 广义MILP; 共识-ADMM算法; 战略投资问题; 程序修改。,GAMS程序:ADMM算法在发电商竞标策略中的应用示例

    springboot整合Quartz实现动态配置定时任务.zip

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行,功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    重庆市农村信用合作社 农商行数字银行系统建设方案.ppt

    重庆市农村信用合作社 农商行数字银行系统建设方案.ppt

    三菱FX5U定位模块与昆仑通态触摸屏包装机配置程序集成:五轴控制及双轴插补技术,三菱FX5U定位模块与伺服系统控制:包装机配置清单及功能分配手册,三菱 FX5U定位模块5轴 2轴插补伺服 包括三菱FX

    三菱FX5U定位模块与昆仑通态触摸屏包装机配置程序集成:五轴控制及双轴插补技术,三菱FX5U定位模块与伺服系统控制:包装机配置清单及功能分配手册,三菱 FX5U定位模块5轴 2轴插补伺服 包括三菱FX5U伺服5轴程序2轴插补,昆仑通态触摸屏程序。 包装机程序,有详细配置清单 IO表 功能分配等清单 扩展FX5-16ET-ES-H定位,有定位设置说明 ,三菱FX5U;定位模块;5轴;2轴插补伺服;昆仑通态触摸屏程序;包装机程序;配置清单;IO表;功能分配;扩展FX5-16ET-ES-H定位设置。,三菱FX5U定位模块:5轴伺服控制与2轴插补程序包

Global site tag (gtag.js) - Google Analytics