• ajax json 使用


    java1234官网

    废话不说了,直接上代码示例吧

    jsp页面:

     1 <%@ page language="java" contentType="text/html; charset=utf-8"
     2     pageEncoding="utf-8"%>
     3 <html>
     4 <head>
     5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     6 <title>Insert title here</title>
     7 <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
     8 <script type="text/javascript">
     9     function ajaxChangePeopele(){
    10         $.post("changePeople",{currentPeople:$("#v").val()},
    11              function(data){
    12                 $("#v").val(data);
    13             }
    14         );
    15     }
    16     
    17     function selectType2(){
    18         $.post("type",{fid:$("#type1").val()},
    19             function(data){
    20             var type2 = $('#type2');
    21             type2.html('<option value="0">---请选择二级---</ooption>');
    22             //alert(data);
    23             var json=eval("[{'id':'4','name':'学院简介'}, {'id':5,'name':'组织机构'},{'id':'6','name':'师资队伍'}, {'id':'7','name':'学科建设'}]");
    24             console.log(json);
    25             $.each(json, function(i,v){
    26                 alert("这里执行了");
    27                 alert(v);
    28                 alert(v.id+":"+v.name);
    29                 type2.append("<option value='"+v.id+"'>"+v.name+"</option>");
    30             });
    31         }
    32         );
    33     }
    34 </script>
    35 </head>
    36 <body>
    37 Jquery Ajax测试<br/>
    38 当前人:<input type="text" id="v" value="张三"/><br/>
    39 <input type="button" value="Ajax请求后台换人" onclick="ajaxChangePeopele()"/>
    40 <br/>
    41 <hr>
    42     <select name="type1" id="type1" onchange="selectType2(this.value)">
    43         <option value="0">---请选择一级---</option>
    44         <option value="1">学院概况</option>
    45         <option value="2">计划总结</option>
    46     </select>
    47 
    48     <select name="type2" id="type2">
    49         <option value="0">---请选择二级---</option>
    50     </select>
    51     
    52 </body>
    53 </html>

    运用到项目中的时候按照data的格式来写

    list1.add("{'id':'"+type.getId()+"','name':'"+type.getName()+"'}");
  • 相关阅读:
    笔记类软件的选择——有道云笔记与OneNote
    蓝屏的解决办法
    imshow()不显示灰度图像
    对待电子产品出问题的态度
    文献的管理、阅读及笔记
    电脑安全设置
    搜索引擎的选择与在chrome上的设置
    用Quartz处理定时执行的任务
    bootstrap datetimepick 时分秒选择,坑我15个小时,整理记录
    bootstrap可编辑下拉框jquery.editable-select
  • 原文地址:https://www.cnblogs.com/ligui989/p/3235997.html
Copyright © 2020-2023  润新知