`

jquery取后台list

阅读更多
html code
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<script type="text/javascript">

function initList(){
    var xhr;
    if(window.XMLHttpRequest)
        xhr = new XMLHttpRequest();
    else if(window.ActiveXObject)
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    xhr.open("get", "showListServlet", true);
    xhr.onreadystatechange = function(){
        if(xhr.status == 200 && xhr.readyState == 4){
            parseXML2List(xhr.responseXML);
        }
    }
    xhr.send(null);
}

function parseXML2List(xml){
    var list = document.getElementById('list');
    while(list.childNodes.length>0)
        list.removeChild(list.firstChild);
   
    var items = xml.getElementsByTagName("item");
    for(var i=0;i<items.length;i++){
        var option = document.createElement("option");
       
        var text = "";
        if(items[i].childNodes.length > 0)
            text = items[i].firstChild.nodeValue;
       
        var nText = document.createTextNode(text);
        option.appendChild(nText);
        list.appendChild(option);
    }
}

</script>
</head>
<body onload="initList();">
<select id="list" size="5" style="width: 100px">
</select>
</body>
</html>

servlet code

package com.liyh.servlets;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@SuppressWarnings("unchecked")
public class ShowListServlet extends HttpServlet {

    private static final long serialVersionUID = -6920365688165262694L;

    private final List list = new ArrayList();

    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //servlet返回的内容不允许客户端缓存
        resp.setHeader("cache-control", "no-cache");        resp.setContentType("text/xml;charset=UTF-8");
        PrintWriter out = resp.getWriter();
        StringBuilder xml = new StringBuilder();
        xml.append("<items>");
        for (Object o : list) {
            xml.append("<item>").append(o).append("</item>");
        }
        xml.append("</items>");
        out.print(xml.toString());
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doGet(req, resp);
    }

    @Override
    public void init() throws ServletException {
        list.add("xxaaaa");
        list.add("");
        list.add("xxbbbb");
        list.add("");
        list.add("xxcccc");
        list.add("xxdddd");
    }
}

分享到:
评论

相关推荐

    jquery获取后台数据生成下拉框

    本文将深入探讨如何使用jQuery结合Ajax技术从后台获取数据,并动态生成下拉选择框(Dropdown List)。 首先,理解jQuery的核心概念至关重要。jQuery通过一个简洁的语法,使得JavaScript代码更易读写,例如,`$...

    jQuery的Ajax实现异步传输List、Map

    本话题将深入探讨如何使用jQuery的Ajax功能实现异步传输List和Map类型的数据,同时涉及JSON数据格式的使用。 首先,让我们了解JSON(JavaScript Object Notation),它是轻量级的数据交换格式,易于人阅读和编写,...

    jQuery接受后台传递的List的实例详解

    总结起来,jQuery接受后台传递的List的实现包括两部分:后端通过`@ResponseBody`注解将List对象转换为JSON并返回,前端通过jQuery的AJAX方法获取数据,然后使用`jQuery.each`遍历并处理每个元素。理解这个过程对于...

    jquery ajax后台返回list,前台用jquery遍历list的实现

    在讨论jquery ajax后台返回list, 前台用jquery遍历list的实现时,我们首先需要了解几个关键概念和知识点。jQuery是一个快速、小巧、功能丰富的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互,使得...

    jquery ajax 向后台传递数组参数示例

    本文将深入讲解如何在jQuery AJAX中向后台传递数组参数,并提供示例代码。 首先,理解问题的关键在于JavaScript数组在传递给后台时,如果数组内包含的是对象,会被转化为`[object Object]`的字符串形式。这是因为...

    JAVA AJAX中使用dwr获取后台list并在页面用表格显示

    在这个特定的项目中,"JAVA AJAX中使用dwr获取后台list并在页面用表格显示",我们将探讨如何结合Direct Web Remoting (DWR) 框架来实现这一功能,同时涉及到二级联动的概念。 DWR是一个开源的Java库,它允许...

    asp.net三层 jquery调用后台数据例子

    在这个案例中,我们将探讨如何使用jQuery在客户端通过POST方法调用ASP.NET WebService,进而获取由三层架构支持的后台数据。JSON(JavaScript Object Notation)格式的数据在后台与前端之间进行传输,它轻量级且易于...

    struts2+jquery+json+List

    1. **Action类的处理**:在Struts2的Action类中,你需要创建一个包含List对象的属性,这个List将存储后台处理的数据。例如: ```java private List&lt;MyObject&gt; dataList; // getter & setter ``` 2. **序列化...

    jQuery+json+servlet 动态取后台数据

    标题“jQuery+json+servlet 动态取后台数据”揭示了一个常见的Web开发场景,其中前端JavaScript库jQuery被用来从后端服务器(通过servlet)获取动态数据,这些数据以JSON(JavaScript Object Notation)格式传输。...

    Asp.net中JQuery、ajax调用后台方法总结

    Asp.net 中 jQuery、ajax 调用后台方法总结 在 Asp.net 中,使用 jQuery 和 Ajax 调用后台方法是一种常见的做法。下面总结了几种常见的调用方法。 有参数的方法调用 在前台使用 jQuery 代码调用后台方法时,需要...

    jQuery网站后台常用多级侧边栏导航菜单代码.zip

    总结起来,"jQuery网站后台常用多级侧边栏导航菜单代码.zip"这个资源提供了一个完整的实现多级侧边栏导航菜单的解决方案。通过HTML构建菜单结构,jQuery处理交互逻辑,CSS进行样式设计,三者协同工作,创建出用户...

    jquery ztree 从后台action加载树节点

    本文将详细介绍如何使用jQuery ZTree结合Ajax技术从后台Action获取JSON格式的数据并将其展示成树形结构。 #### 技术栈介绍 1. **jQuery**: 是一种流行的JavaScript库,简化了HTML文档遍历、事件处理、动画等操作。...

    jquery 通过ajax请求获取后台数据显示在表格上的方法

    今天小编就为大家分享一篇jquery 通过ajax请求获取后台数据显示在表格上的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

    jquery利用ajax调用后台方法实例

    // 后台逻辑,获取数据并转换为JSON格式返回 return Json(list, JsonRequestBehavior.AllowGet); } ``` 这是ASP.NET MVC的一个Action方法,它负责处理Ajax请求。返回的是JSON格式的数据,可以被jQuery的Ajax请求...

    jQuery-Easyui 多级菜单 前后台

    根据提供的文件信息,我们可以推断出这是一个关于使用`jQuery-EasyUI`框架实现多级菜单功能的示例代码。此代码主要关注后端部分,即如何构建和返回一个JSON格式的数据,供前端显示多级菜单使用。下面我们将详细介绍...

    MVC3用Jquery Post Array 在后台Action获得集合

    本知识点主要探讨如何利用jQuery的`$.post`方法将JavaScript数组发送到后台Action,并在服务器端获取并处理这些数据。这通常涉及到JSON序列化、HTTP请求以及MVC模型绑定等技术。 首先,jQuery的`$.post`函数是用于...

    ajax从后台读json数据,jquery在页面简析

    在本示例中,jQuery将用于发起Ajax请求,接收并解析JSON数据,然后在页面上以表格形式展示这些数据,实现局部刷新。 **Ajax与jQuery结合使用** 1. **创建Ajax请求**:在jQuery中,可以使用`$.ajax()`函数发起一个...

    JAVA AJAX中使用DWR获取后台list并在页面 用表格动态显示

    在这个项目中,DWR被用来实现在不刷新整个页面的情况下,从后台获取list数据并动态地在表格中展示,同时还有二级联动功能的实现,增加了用户操作的便捷性。下面我们将深入探讨这个项目的各个关键技术点。 首先,DWR...

Global site tag (gtag.js) - Google Analytics