zoukankan      html  css  js  c++  java
  • Ajax二级联动

     1 <%--
     2   Created by IntelliJ IDEA.
     3   User: x1c
     4   Date: 2019-12-22
     5   Time: 10:04
     6   To change this template use File | Settings | File Templates.
     7 --%>
     8 <%@ page contentType="text/html;charset=UTF-8" language="java" %>
     9 <html>
    10   <head>
    11     <title>$Title$</title>
    12     <script>
    13       //function里面的参数如果写value 则获取不到
    14       function fun1(val){
    15           var xhr=  new XMLHttpRequest();
    16           xhr.open("GET","phoneServlet?val="+val,true)
    17           xhr.onreadystatechange=function () {
    18               //只有完成后才显示
    19               if(xhr.readyState==4&&xhr.status==200){
    20                   //获取响应的文本内容
    21                   var phone = xhr.responseText;
    22                   //包头不包尾
    23                  var phone3= phone.substring(1,phone.length-1)
    24 
    25                   var phone4 =phone3.split(", ");
    26 
    27                  var phone2= document.getElementById("p");
    28                   //清空原有数据
    29                   phone2.innerHTML="<option >-请选择机型-</option>"
    30                  for(var i in phone4){
    31                         phone2.innerHTML+="<option>"+phone4[i]+"</option>"
    32                   }
    33 
    34               }
    35 
    36 
    37 
    38           }
    39           xhr.send(null)
    40       }
    41 
    42     </script>
    43   </head>
    44   <body>
    45 <select onchange="fun1(this.value)">
    46   <option >-请选择手机品牌-</option>
    47   <option value="1">华为</option>
    48   <option value="2">小米</option>
    49   <option value="3">oppo</option>
    50 </select>
    51   <select id="p">
    52     <option >-请选择机型-</option>
    53   </select>
    54   </body>
    55 </html>
    package com.bj;
    
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.IOException;
    import java.util.ArrayList;
    import java.util.List;
    
    @WebServlet("/phoneServlet")
    public class PhoneServlet extends HttpServlet {
        @Override
        protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
            String value = req.getParameter("val");
            List<String> Phone = new ArrayList<String>();
            if(value.equals("1")){
                Phone.add("HAWEIMATE9 PRO");
                Phone.add("HAWEIMATE10 PRO");
                Phone.add("HAWEIMATE20 PRO");
            } else if("2".equals(value)){
                Phone.add("小米4");
                Phone.add("小米8");
                Phone.add("小米2s");
            } else if("3".equals(value)){
                Phone.add("OPPOX");
                Phone.add("OPPOXx");
                Phone.add("OPPOXxx");
            }
            resp.setCharacterEncoding("UTF-8");
            resp.setContentType("text/html;charset=UTF-8");
            //集合的输处格式
            resp.getWriter().print(Phone.toString());
        }
    }
  • 相关阅读:
    接着上回,导包正确之后,出现javabean.Friend cannot be cast to java.util.List,的错误。找了很久。以为是User user0作为参数,改成了String username还是错误,看了看listFriend.jsp没有错误,我想会不会是包多了,导致类型复杂。最后发现包少了一个:
    c语言
    软链接和硬链接的联系和区别
    centos7怎么永久修改hosname
    虚拟机静态ip设置
    Centos、Ubuntu开启命令模式
    Kubernetes重要概念理解
    人生道路上,永远没有“容易”二字
    知识【英文】
    模板【kruskal重构树】
  • 原文地址:https://www.cnblogs.com/9797ch/p/12079232.html
Copyright © 2011-2022 走看看