文档章节

联动列表 ajax

s
 stmoon
发布于 2017/03/28 09:19
字数 371
阅读 1
收藏 0

       //创建XMLHttpReques对象
       function createXMLHttpRequest() {
          if (window.XMLHttpRequest) {
               //Mozilla 浏览器
               XMLHttpReq = new XMLHttpRequest();
            } else{
                // IE浏览器
                if (window.ActiveXObject) {
                  try {
                         XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP");
                      }catch (e) {
                         try {
                                XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
                             }catch (e) { }
                      }
                 }
            }
        }
        
       //处理服务器响应结果
       function handleResponse() {
        // 判断对象状态
        if (XMLHttpReq.readyState == 4) {
            // 信息已经成功返回,开始处理信息
           if (XMLHttpReq.status == 200) {
                var out = "";
                var res = XMLHttpReq.responseXML;
                clearList();
                var subClass = res.getElementsByTagName("toyop");
                for(var i=0;i<subClass.length;i++)
                {
                    var top = subClass(i).getElementsByTagName("top")[0].firstChild.nodeValue;
                    var sub = subClass(i).getElementsByTagName("sub")[0].firstChild.nodeValue;
                    addOption(top,sub);
                }
               }
         }
       }
        
       //刷新第二个下拉列表
       function refreshList()
       {
          var toyClass = document.getElementById("toyClass").value;
          var toyUrl="/toysshop/servlet/DynamicList?toyClass="+toyClass;
          sendRequest(toyUrl);
          
       }
        
     //发送客户端的请求
      function sendRequest(url) {
            createXMLHttpRequest();
            XMLHttpReq.open("get", url, true);
            
            //指定响应函数
            XMLHttpReq.onreadystatechange = handleResponse;
            // 发送请求
            XMLHttpReq.send(null);
       }
       //清除下拉列表中的值
       function clearList()
       {
           var subList = document.getElementById("subClass");
           while(subList.childNodes.length>0)
           {
               subList.removeChild(subList.childNodes[0]);
           }        
       }
       //把满足条件的商品信息添加到第二个下拉列表中
       function  addOption(top,sub)
       {
           var subList = document.getElementById("subClass");
           var option = document.createElement("option");
           option.appendChild(document.createTextNode(sub));
           subList.appendChild(option);
           
       }
       
       
       //图片上传
              
       //处理服务器响应结果
       function handleupResponse() {
        // 判断对象状态
        if (XMLHttpReq.readyState == 4) {
            // 信息已经成功返回,开始处理信息
           if (XMLHttpReq.status == 200) {
                var out = "";
                var res = XMLHttpReq.responseXML;
                var response = res.getElementsByTagName("upload")[0].firstChild.nodeValue;
            }
         }
       }
 
       //添加商品到购物车
       function uploadImg()
       {
          var toys = document.getElementById("toys").value;
          var toyUrl="/toysshop/servlet/FileUpload?toys="+toys;
          sendupRequest(toyUrl);
          
       }
        
     //发送客户端的请求
      function sendupRequest(url) {
            createXMLHttpRequest();
            XMLHttpReq.open("get", url, true);
            //指定响应函数
            XMLHttpReq.onreadystatechange = handleupResponse;
            // 发送请求
            XMLHttpReq.send(null);
       }
      function setupMsg(msg) {
        mdiv = document.getElementById("showUpload");
        if(msg.length == 2) {
        sendupRequest("/toysshop/Admin/adminIndex.jsp?action=addtoys")
            mdiv.innerHTML = "<font color='red'>上传图片成功</font>";
        } else {
            mdiv.innerHTML = "<font color='y'>no goods exities!</font>";
        }
      }
      
     

本文转载自:http://blog.csdn.net/stermon/article/details/2882255

s
粉丝 0
博文 4
码字总数 0
作品 0
长沙
项目经理
私信 提问
ajax 动态生成二级联动下拉列表

无限级二级菜单,越来越多的被应用,譬如省级->市级的二级菜单 思路:一级下拉列表select 绑定一个id, jqury获取到该下拉列表的checked属性值,通过ajax请求获取到该值所对应的二级内容,然...

喜欢敲代码的感觉
2014/10/28
1K
0
day18 jQuery 加强

封装ajax: jQuery中ajax的封装: ajax案例: 用户名是否重复: 二级联动: jQuery案例 --------左右选择: jQuery案例 --------好友列表: jQuery案例 --------表格排序: 事件(文档加载完,...

萧小蚁
2016/03/26
15
0
基于 jQuery 的多级联动菜单插件--cxSelect

cxSelect 是基于 jQuery 的多级联动菜单插件,适用于省市、商品分类等联动菜单。 列表数据通过 AJAX 获取,也可以自定义,数据内容使用 JSON 格式。 同时兼容 Zepto,方便在移动端使用。 国内...

看看这天
2017/10/23
921
0
JavaWeb15-HTML篇笔记(三)

1.1 案例三:使用JQuery完成仿百度的信息提示:1.1.1 需求: 在一个搜索页面中,键盘输入一些信息,在文本框下面给出一些提示信息(需要从服务器端进行查询的). 1.1.2 分析:1.1.2.1 步骤分析: ...

我是小谷粒
2018/06/01
0
0
ThinkPHP + Ajax 实现2级联动下拉菜单

首先是数据库的设计。分类表叫cate. 我做的是分类数据的二级联动,数据需要的字段有:id,name(中文名),pid(父id). 父id的设置: 若数据没有上一级,则父id为0,若有上级,则父id为上一级的id。...

Jceee
2014/04/07
6.9K
7

没有更多内容

加载失败,请刷新页面

加载更多

Spring Cloud 笔记之Spring cloud config client

观察者模式它的数据的变化是被动的。 观察者模式在java中的实现: package com.hxq.springcloud.springcloudconfigclient;import org.springframework.context.ApplicationListener;i...

xiaoxiao_go
今天
4
0
CentOS7.6中安装使用fcitx框架

内容目录 一、为什么要使用fcitx?二、安装fcitx框架三、安装搜狗输入法 一、为什么要使用fcitx? Gnome3桌面自带的输入法框架为ibus,而在使用ibus时会时不时出现卡顿无法输入的现象。 搜狗和...

技术训练营
今天
4
0
《Designing.Data-Intensive.Applications》笔记 四

第九章 一致性与共识 分布式系统最重要的的抽象之一是共识(consensus):让所有的节点对某件事达成一致。 最终一致性(eventual consistency)只提供较弱的保证,需要探索更高的一致性保证(stro...

丰田破产标志
今天
7
0
docker 使用mysql

1, 进入容器 比如 myslq1 里面进行操作 docker exec -it mysql1 /bin/bash 2. 退出 容器 交互: exit 3. mysql 启动在容器里面,并且 可以本地连接mysql docker run --name mysql1 --env MY...

之渊
今天
7
0
python数据结构

1、字符串及其方法(案例来自Python-100-Days) def main(): str1 = 'hello, world!' # 通过len函数计算字符串的长度 print(len(str1)) # 13 # 获得字符串首字母大写的...

huijue
今天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部