`

ajax 异步加载数据

阅读更多
function changePhoneType(obj1ID,obj2ID){

        var objArea = document.getElementById(obj1ID);
var id = objArea.value;
    var url = "$common.root()/page/downClient.do?method=getPhoneType&phoneBrandId="+id;
        var myAjax  = new Ajax.Request(url, {method: 'get',onComplete: showesay});

}

//组装机型下拉框
function showesay(dataResponse) {  
    if(dataResponse.status==200)
{
            var objTown = document.getElementById('phoneType');
            var i;
            for(i = objTown.options.length ; i >= 0 ; i--){
                    objTown.options[i] = null;
            }
            objTown.options[0] = new Option("选择机型");
            objTown.options[0].value = "";

    var data=eval('('+dataResponse.responseText+')');
   
    for(var i=0;i<data.length;i++){
                    var op= document.createElement("option");  
                    op.text = data[i].tname;  
                    op.value = data[i].cname;  
                    objTown.options.add(op);  
    }
    }

    else{
    alert("查询手机品牌失败!");
    }
   




if (phoneTypeList != null) {
json.append("[");
int i=1;
for (Object o : phoneTypeList) {
PhoneType pType = (PhoneType) o;
if(i==1){
json.append("{\"tname\":\""+pType.getPhoneBrandCnName()+" "+pType.getPnoneTypeName()+"\",\"cname\":\""+pType.getClientName()+"\"}");
i++;
}
else{
json.append(",{\"tname\":\""+pType.getPhoneBrandCnName()+" "+pType.getPnoneTypeName()+"\",\"cname\":\""+pType.getClientName()+"\"}");
}

}
json.append("]");
}


注意两个地方:
一、在action里生成数据的要符合json格式[{"x":"y"},{"z","a"}];直接用out或者response.getWrite().print(json.toStirng());且在struts1.1的findMapping中直接返回null
二、在前端直接eval('('+dataResponse.responseText+')'),来组织js对象数据,然后拼装需要的数据。
分享到:
评论

相关推荐

    dtree+ajax异步加载树

    **dtree+ajax异步加载树详解** 在Web开发中,数据展示往往涉及到大量的层级结构,如文件系统、组织架构等。dtree是一款基于JavaScript的树形控件,它能够帮助开发者实现动态、交互式的树状菜单。而Ajax...

    Javascript vue.js表格分页,ajax异步加载数据

    在JavaScript和Vue.js框架中,实现表格分页和AJAX异步加载数据是常见的需求,尤其是在处理大量数据时,为了提高用户体验,我们会将数据分批加载。以下将详细讲解这个过程。 首先,Vue.js允许我们创建自定义组件,...

    jQuery实现支持Ajax异步加载的树形下拉菜单源码.zip

    本资源"jQuery实现支持Ajax异步加载的树形下拉菜单源码.zip"提供了一个利用jQuery创建的树形下拉菜单,该菜单具有通过AJAX异步加载数据的功能。下面我们将详细探讨这个技术点。 首先,jQuery的核心优势在于其简洁的...

    Echarts:基础折线图(含异步加载数据)

    本主题将聚焦于ECharts的基础折线图及其异步加载数据的方法。 首先,让我们了解一下ECharts中的基础折线图。折线图是一种常见的数据展示方式,适用于表现数据随时间变化的趋势。在ECharts中,创建一个基础折线图...

    以AJAX方式加载图片=异步加载图片,先显示个图片的占位图片 此技术常见于漫画网站.zip

    在网页开发中,异步加载图片(以AJAX方式加载图片)是一种常见的优化技术,尤其在处理大量图片的场景下,比如漫画网站。通过这种方式,可以显著提高页面加载速度,提升用户体验。AJAX(Asynchronous JavaScript and ...

    网页数据抓取工具,ajax异步数据获取,模拟访问网页提取内容

    总的来说,这个网页数据抓取工具利用了C#的强大力量,结合AJAX异步加载数据的特点,提供了一个全面的解决方案,从模拟浏览器访问网页,到提取和存储数据,再到对不熟悉JavaScript用户的辅助支持,覆盖了数据抓取的全...

    jQuery+ajax异步加载分页代码

    总结,这个jQuery+Ajax异步加载分页代码实现了动态加载数据,提高了用户体验,同时允许自定义分页设置,具有很好的灵活性和实用性。通过理解并实践这个示例,开发者可以更好地掌握Ajax和jQuery在实际项目中的应用。

    ASP.NET中异步加载数据的无刷新Tab源代码

    异步加载数据的核心是利用AJAX(Asynchronous JavaScript and XML),尽管XML现在已经被JSON所取代。ASP.NET提供了内置的AJAX支持,通过ASP.NET AJAX库(包括UpdatePanel、ScriptManager等控件)实现无刷新更新。...

    H5移动端上滑加载,带ajax异步请求后台数据,拿来即用

    这种功能通常与Ajax异步请求后台数据相结合,实现无缝的数据加载。 一、H5移动端上滑加载原理 H5移动端上滑加载的核心在于监听用户的滚动事件,当用户滚动到页面底部时,触发一个函数,该函数通过Ajax发送请求至...

    Jquery 封装下的ajax异步加载

    本资源提供了一个基于jQuery的AJAX异步加载的Web项目实例,通过导入MyEclipse开发环境即可运行,涉及到的主要技术包括jQuery、JSON以及Servlet。 ### jQuery中的AJAX jQuery提供了`.ajax()`函数,它是所有AJAX功能...

    ajax异步获取数据

    **Ajax(Asynchronous JavaScript and XML)异步JavaScript与XML**是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这种技术使得Web应用能够更快、更高效地与服务器进行交互,提高了用户体验。...

    jQuery+ajax异步加载分页代码.zip

    总结来说,"jQuery+Ajax异步加载分页代码.zip"示例展示了一个完整的异步分页解决方案,涵盖了前端事件绑定、Ajax请求、服务器数据交互以及后端响应处理。这个例子不仅适用于初学者了解异步分页的基本原理,也为有...

    Easyui异步生成树节点,动态获取树节点

    它支持通过 JSON 数据源或者 AJAX 异步加载数据。在“异步生成树节点”中,这意味着树节点不是一次性加载所有数据,而是根据需要在用户交互时动态获取。 2. **异步加载** 异步加载是提高用户体验的重要方式,尤其...

    Echarts通过Ajax实现动态数据加载

    ### Echarts通过Ajax实现动态数据加载 #### 一、引言 在现代Web开发中,数据可视化是一项重要的技能。Echarts作为一款强大的JavaScript图表库,因其丰富的图表类型、灵活的配置选项以及良好的交互性而备受开发者...

    ajax异步调用数据

    综上所述,"ajax异步调用数据"是一个关于利用JavaScript和XML(或JSON)技术实现页面无刷新的数据更新的学习项目。通过理解和实践,开发者可以掌握Ajax的基本用法,提高用户体验,实现高效的Web应用交互。

    如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)

    异步加载数据意味着不需要刷新整个页面,就能更新数据,提高用户体验。 在本教程中,我们使用PHP作为服务器端编程语言,jQuery用于简化JavaScript的开发和进行异步HTTP请求(AJAX),MySQL作为数据库存储数据。整个...

    asp.net Ajax异步加载图片,瀑布流加载图片

    在"asp.net Ajax异步加载图片,瀑布流加载图片"的项目中,开发者已经创建了一个完全可运行的Demo,这个Demo应该是使用Visual Studio 2010开发的,并且已经通过了编译,这意味着它应该能够直接在支持ASP.NET的环境中...

    异步数据加载时,所用的等待组件,JS源码,类似于UI Block

    在描述中提到,这个组件是针对AJAX(Asynchronous JavaScript and XML)异步加载数据场景设计的。AJAX允许网页在不重新加载整个页面的情况下,与服务器交换数据并局部更新页面。当使用AJAX请求时,加载指示器会在...

    Ajax 异步加载解析

    要实现Ajax异步加载,需要遵循以下步骤: 1. **创建Ajax对象**:由于不同的浏览器对Ajax支持的实现存在差异,因此通常需要创建一个XMLHttpRequest对象。在JavaScript中,这是通过`new XMLHttpRequest()`完成的。...

    基于jsp+servlet+Ajax异步登陆模拟web项目

    【基于jsp+servlet+Ajax异步登陆模拟web项目】是一个典型的Web开发实例,它整合了三种核心技术:JavaServer Pages(JSP)、Servlet以及Asynchronous JavaScript and XML(Ajax)。这个项目的核心目的是实现用户登录...

Global site tag (gtag.js) - Google Analytics