`
kongbei_ly
  • 浏览: 7788 次
  • 性别: Icon_minigender_1
  • 来自: 长沙
文章分类
社区版块
存档分类
最新评论

关于Ajax返回的数据显示到网页的问题

阅读更多

先说明下我的问题:
我想做一个仿Google Suggest的搜索框,输入keyWord时会返回一些数据,再显示到搜索框的下方的div中。
我已经成功获取的返回的数据,可是我不知道怎样将数据按照一定的格式显示到网页中。

这是我js里面的代码

function search() {
    var jqueryObj = $("#txtSearch");
    var searchStr = jqueryObj.val();
    $.get("SearchSuggest?search=" + searchStr, null, callback);
}

function callback(data) {
    var jqueryObj = $(data);
    var resultObj = $("#search_suggest");
        resultObj.empty();
    var str = data.split("\n");
}

截两张图:
输入“刘”字
用firebug查看:

服务器返回的数据是String类型的并且以"\n"做为分隔符。
下面一段是servlet中的代码:


vData = ss.search(search);
StringBuffer buf = new StringBuffer();
for (int i = 0; i < vData.size(); i++) {
String keyWord = (String) vData.get(i);
buf.append(keyWord + "\n");
}
System.out.println(buf.toString());

输出的数据截图

  • 大小: 3.7 KB
  • 大小: 15.4 KB
  • 大小: 24.4 KB
分享到:
评论

相关推荐

    jQuery中ajax请求后台返回json数据并渲染HTML的方法

    jQuery中的AJAX请求是一种非常常见的前端异步数据交互方式,它的作用是使得页面无需重新加载即可向服务器请求数据,并将数据动态地加载到页面中。JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它...

    解决ajax返回innerHTML中javascript不能运行问题

    实际上,我们可以在 Ajax 返回数据并 `innerHTML` 到模板之前先把 `&lt;div&gt;` 中的 JavaScript 取出并写到模板页面的 `&lt;head&gt;` 中让浏览器解析。这样就相当于在打开模板页面的同时加载了所有 `&lt;div&gt;` 标签需要的 ...

    HTML+AJAX(手写ajax)显示数据库数据

    在这个项目中,我们将结合HTML和AJAX,通过C#后端代码来从数据库获取数据,并将其动态地显示在网页上,实现页面的局部刷新。 首先,我们需要理解HTML的基础结构。一个简单的HTML页面通常包括`&lt;!DOCTYPE html&gt;`声明...

    ajax读取数据jqchart图表显示

    首先,让我们了解Ajax的核心概念,然后详细分析JqChart库的使用,以及如何将从服务器获取的数据整合到图表中。 **Ajax(异步JavaScript和XML)**是一种在无需重新加载整个网页的情况下更新部分网页的技术。通过在...

    php教程 ajax返回 网页特效on数据实例

    - 客户端接收到服务器端返回的JSON数据后,可以使用`eval`函数将其解析成JavaScript对象。 - 解析后的数据可以方便地被JavaScript程序访问和使用。 #### 四、代码详解 1. **HTML结构**: - 页面包含一个按钮,...

    ASP+Ajax网页交互动态添加删除数据一例

    前端JavaScript根据响应更新页面,移除对应的数据显示,同时给出操作结果的提示。 **文件jb51.net** 在提供的文件名称“jb51.net”中,虽然没有明确指出具体内容,但通常这种格式的文件可能是网页教程或者示例代码...

    php+jQuery ajax实现的实时刷新显示数据功能示例

    通过本文的介绍,可以了解到使用php和jQuery ajax技术实现网页数据实时刷新显示的基本方法和步骤。技术实现的重点在于后端php脚本的编写,以及前端JavaScript和ajax的使用。同时,数据库的操作也是实现本功能不可或...

    获取Ajax网站数据

    这通常涉及到查看网页源代码、使用开发者工具(如Chrome DevTools)的网络面板,查找相关的Ajax请求。一旦找到请求的URL、HTTP方法(GET或POST)以及可能需要的参数,我们就可以在C#中构造相应的请求。 以下是一个...

    ajax大量数据分页

    AJAX(Asynchronous JavaScript and XML)则是一种在不刷新整个页面的情况下与服务器交换数据并更新部分网页的技术。在数据分页场景中,AJAX用于异步地从服务器获取分页数据,而无需重新加载整个页面。 分页插件如...

    ajax+javascript打印网页数据

    总结来说,使用Ajax和JavaScript,我们可以动态获取和处理服务器数据,然后通过操作DOM显示在网页上,甚至可以进一步实现网页内容的打印。这大大增强了Web应用的交互性和功能,使得用户无需离开当前页面就能获取和...

    ajax返回字符串

    Ajax返回字符串是Ajax交互过程中一个常见的场景,它涉及到JavaScript、HTTP请求和响应处理等多个方面。以下是对这个主题的详细解释: 一、Ajax基础 Ajax的核心是JavaScript对象XMLHttpRequest,它允许在后台与...

    ajax说明 事件 绑定 数据

    Ajax,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种创建动态网页的技术,允许在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。Ajax的核心是通过JavaScript来实现局部刷新...

    AJAX实现读取本地文本文档内容并展示在网页上

    最后,通过responseText或responseXML属性获取服务器返回的数据。 对于读取本地文本文档,由于浏览器的安全限制,直接使用AJAX无法访问本地文件系统。因此,我们需要使用HTML5的File API来实现这一功能。用户通常...

    JS从PHP获取数据显示在网页

    在实际应用中,我们还可以使用现成的库如jQuery的$.ajax()或现代的fetch API简化AJAX操作,同时结合前端框架(如React、Vue或Angular)的虚拟DOM特性,高效地更新大量数据显示在网页上。 总结起来,JS从PHP获取数据...

    ajax控制div窗口显示和隐藏

    在网页开发中,Ajax(Asynchronous JavaScript and XML)是一种创建动态网页的技术,它允许在不刷新整个页面的情况下,与服务器交换数据并更新部分网页内容。本主题主要关注如何使用Ajax来控制div窗口的显示和隐藏,...

    ajax 网页特效 实例教程

    `XMLHttpRequest`对象是Ajax的基础,它提供了一种在后台与服务器交换数据并更新部分网页的能力。以下是一些关键的方法和属性: 1. **open()**:初始化一个请求,参数包括请求类型(GET或POST)、URL和是否异步。 2....

    Ajax返回数据之前的loading等待效果

    我们通过ajax请求,向后台传递参数,然后后台经过一系列的运算之后向前台返还数据,我希望在等待数据成功返还之前可以展示一个...接下来通过本文给大家分享Ajax返回数据之前的loading等待效果,需要的朋友可以参考下

    Ajax实现responseXML返回信息显示

    Ajax(Asynchronous JavaScript and XML)是一种创建动态网页的技术,它允许我们在不刷新整个页面的情况下从服务器获取数据并更新部分网页内容。 首先,我们需要了解Ajax的核心组件。在本例中,我们有两个主要的ASP...

    ajax请求后台接口数据与返回值处理js的实例讲解

    根据返回数据中字段SuccessCode的值,执行不同的业务逻辑,如禁用按钮、改变按钮样式和显示不同的提示信息等。 知识点五:JSON数据类型 JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读...

    ajax与servelt相互传递数据

    6. **DOM更新**:最后,JavaScript更新DOM树,将接收到的数据显示在网页的相应位置,无需整个页面刷新。 以压缩包中的`ajaxDemo`为例,这个示例可能包含了一个简单的AJAX调用Servlet的例子。前端可能有一个...

Global site tag (gtag.js) - Google Analytics