码迷,mamicode.com
首页 > Web开发 > 详细

js day03

时间:2018-06-01 10:42:36      阅读:213      评论:0      收藏:0      [点我收藏+]

标签:prepare   ror   except   处理   cin   接收   lse   方式   1.0   

一)jQuery常用AJAX-API

    目的:简化客户端与服务端进行局部刷新的异步通讯

   (1)取得服务端当前时间

            简单形式:jQuery对象.load(url)

                           返回结果自动添加到jQuery对象代表的标签中间

                           如果是Servlet的话,采用的是GET方式

        复杂形式:jQuery对象.load(url,sendData,function(backData,textStatus,ajax){... ...})

                           sendData = {"user.name":"jack","user.pass":"123"};

                           以JSON格式文本方式发送,使用POST方式发送,服务端能收到数据

        注意:对于load方法而言,如果请求体无参数发送的话,load方法

采用GET方式提交

        注意:对于load方法而言,如果请求体有参数发送的话,load方法

采用POST方式提交

注意:使用load方法时,自动进行编码,无需手工编码

   <script type="text/javascript">

      $(":button").click(function(){

          var url = "${pageContext.request.contextPath}/loadTimeRequest?time"+new Date().getTime();

          var sendData = null;

          $.load(url,sendData,function(a,b,ajax){

             var jsonJAVA = ajax.responseText;

             var jsonJS = eval("("+jsonJAVA+")");

             var strTime = jsonJS.strTime;

             $("span:first").html(strTime).css("color","red");

             $("span:last").html(strTime).css("color","blue");

          });

          //$("span").load(url);

      });

   </script>

 

        load()方法参数解释:

            参数一:url发送到哪里去

            参数二: sendData发送请求体中的数据,符合JSON格式,例如:{key:value,key:value}

            参数三:function处理函数,类似于传统方式ajax.onreadystatechange = 处理函数

 

            其中参数三为function处理函数最多可以接收三个参数,含义如下

                 第一个参数:服务端返回的数据,例如:backData

                 第二个参数:服务端状态码的文本描述,例如:success、error、

                 第三个参数:ajax异步对象,即XMLHttpRequest对象

        以上所有参数的名字可以任意,但必须按顺序书写,尽量做到见名知意

       

   (2)检查注册用户名和密码是否存在

        $.get(url,sendData,function(backData,textStatus,ajax){... ...})

        $.post(url,sendData,function(backData,textStatus,ajax){... ...})赵君提倡

        注意:使用get或post方法时,自动进行编码,无需手工编码

 

   (3)jQuery对象.serialize()

        作用:自动生成JSON格式的文本

            注意:为每个jQuery对象设置一个name属性,因为name属性会被认为请求参数名

            注意:必须用<form>标签元素

            适用:如果属性过多,强烈推荐采用这个API

   <script type="text/javascript">

      //定位按钮,同时添加单击事件

      $(":button").click(function(){

          //获取用户名和密码

          var username = $(":text:first").val();

          var password = $(":text:last").val();

          //去空格

          username = $.trim(username);

          password = $.trim(password);

          //异步发送到服务端

          var url = "${pageContext.request.contextPath}/checkRequest?time="+new Date().getTime();

          /*手工书写JSON文本

          var sendData = {

             "user.username":username,

             "user.password":password

          };

          */

          /*工具生成JSON文本*/

          var sendData = $("form").serialize();

         $.post(url,sendData,function(backData,textStatus,ajax){

             //backData是一个JSON文本/对象,你得通过.号访问其属性值

             var tip = backData.tip;

             //创建img节点

             var $img = $("<img src=‘" + tip + "‘ height=‘18px‘ widht=‘18px‘/>")

             //清空span节点中的内容

             $("span").text("");

             //将img节点添加到span节点中

             $("span").append( $img );

          });

      });

   </script>

       

public class RegisterAction extends ActionSupport{

   private User user;

   public User getUser() {

      return user;

   }

   public void setUser(User user) {

      this.user = user;

   }

   /**

    * 检查注册用户名和密码是否存在

    */

   public String checkMethod() throws Exception {

      tip = "images/MsgSent.gif";

      if("帅帅".equals(user.getUsername()) && "123".equals(user.getPassword())){

          tip = "images/MsgError.gif";

      }

      return "ok";

   }

   private String tip;

   public String getTip() {

      return tip;

   }

   /**

    * var backData = {

    *              "tip":"images/MsgError.gif"

    *             }

    */

}

 

   (4)jQuery解析XML

<?xml version="1.0" encoding="UTF-8"?>

<root>

   <city>广州</city>

   <city>中山</city>

   <city>深圳</city>

   <city>佛山</city>

   <city>珠海</city>

</root>

       

<script type="text/javascript">

      $(":button").click(function(){

          var url = "${pageContext.request.contextPath}/03_city.xml";

          var sendData = null;

         $.get(url,sendData,function(backData,textStatus,ajax){

             /*

             //将xml文件转成jquery对象,目的是用jquery api解析xml文件

             var $xml = $(backData);

             var $city = $xml.find("city");

             $city.each(function(){

                //获取每一个city节点

                var city = $(this).text();

                alert(city);

             });

             */

             var xml = ajax.responseXML;

             var $xml = $(xml);

             var $city = $xml.find("city");

             $city.each(function(){

                //获取每一个city节点

                var city = $(this).text();

                alert(city);

             });

          });

      });

   </script>

 

   (5)省份-城市,基于jQuery的AJAX二级联动,用Struts2整合AJAX【非数据库版】

        $.ajax(

                {

                       type:"POST",

                       url:"${pageContext.request.contextPath}/findCityByProvinceRequest?id="+new Date().getTime(),

                       data:{"province":province},

                       success:function(backData,textStatus,ajax){}

            }

        );

        注意:这里每个key值不能乱写

   <select id="province">

      <option>选择省份</option>

      <option>广东</option>

      <option>湖南</option>

   </select>

   <select id="city">

      <option>选择城市</option>

   </select>

       

<script type="text/javascript">

      $("#province").change(function(){

          //删除原城市下拉框中的内容,除第一项外

          $("#city option:gt(0)").remove();

          var province = $("#province option:selected").text();

          if("选择省份" != province){

             $.ajax({

                "type":"POST",

                "url":"${pageContext.request.contextPath}/findCityByProvince?time="+new Date().getTime(),

                "sendData":{"province":province},

                "success":function(backData,textStatus,ajax){

                   //js对象

                   var city = backData.cityList;

                   //jquery对象

                   var $city = $(city);

                   //each()

                   $city.each(function(){

                       //this表示每个城市

                       var $option = $("<option>" + this + "</option>");

                       $("#city").append( $option );

                   });

                }

             });

          }

      });

   </script>

       

public class ProvinceCityAction extends ActionSupport{

   private String province;//广东

   public void setProvince(String province) {

      this.province = province;

   }

   public String findCityByProvince() throws Exception {

      cityList = new ArrayList<String>();

      if("广东".equals(province)){

          cityList.add("湛江");

          cityList.add("汕头");

      }else if("湖南".equals(province)){

          cityList.add("邵阳");

          cityList.add("浏阳");

      }

      return "ok";

   }

   private List<String> cityList;

   public List<String> getCityList() {

      return cityList;

   }

   /**

    * var backData = {

    *                "cityList":["邵阳","浏阳"]

    *             }

    */

}

       

<struts>

 

   <package name="timePackage" extends="json-default" namespace="/">

      

       <global-results>

          <result name="ok" type="json"/>

       </global-results>

 

      <!-- 获取服务端时间 -->

       <action

          name="loadTimeRequest"

          class="cn.itcast.javaee.js.time.TimeAction"

          method="loadTimeMethod"/>

 

      <!-- 检查用户名和密码是否存在 -->

       <action

          name="checkRequest"

          class="cn.itcast.javaee.js.register.RegisterAction"

          method="checkMethod"/>

         

       <!-- 根据省份查询城市 -->

       <action

          name="findCityByProvince"

          class="cn.itcast.javaee.js.provincecity.ProvinceCityAction"

          method="findCityByProvince"/>

 

   </package>

 

</struts>

 

 

二)掌握Java调用Oracle过程与函数

      写一个计算个人所得税的应用

--定义过程

create or replace procedure get_rax(salary in number,rax out number)

as

    --需要交税的钱

    bal number;

begin

    bal := salary - 3500;

    if bal<=1500 then

       rax := bal * 0.03 - 0;

    elsif bal<=4500 then

       rax := bal * 0.1 - 105;

    elsif bal<=9000 then

       rax := bal * 0.2 - 555;

    elsif bal<=35000 then

       rax := bal * 0.25 - 1005;

    elsif bal<=55000 then

       rax := bal * 0.3 - 2755;

    elsif bal<=80000 then

       rax := bal * 0.35 - 5505;

    else

       rax := bal * 0.45 - 13505;

    end if;

end;

/

 

--调用过程

declare

   --交税

   rax number;

   salary number := &salary;

begin

   get_rax(salary,rax);

   dbms_output.put_line(salary||‘元工资需要交‘||rax||‘元税‘);

end;

/

    

public class TestCallOracleProc {

   public static void main(String[] args) throws Exception{

      String sql = "{call get_rax(?,?)}";

      Connection conn = JdbcUtil.getConnection();

      CallableStatement cstmt = conn.prepareCall(sql);

      cstmt.setInt(1,10000);

      cstmt.registerOutParameter(2,Types.INTEGER);

      cstmt.execute();

      Integer rax = cstmt.getInt(2);

      System.out.println("10000元需要交" + rax + "元税");

      JdbcUtil.close(cstmt);

      JdbcUtil.close(conn);

   }

}

 

 

      查询7788号员工的的姓名,职位,月薪

--定义函数

create or replace function findEmpNameAndJobAndSal(pempno in number,pjob out varchar2,psal out number)

return varchar2

as

    pename emp.ename%type;

begin

    select ename,job,sal into pename,pjob,psal from emp where empno = pempno;

    return pename;

end;

/

 

--调用函数

declare

    pename emp.ename%type;

    pjob   emp.job%type;

    psal   emp.sal%type;

begin

    pename := findEmpNameAndJobAndSal(7788,pjob,psal);

    dbms_output.put_line(‘7788‘||‘--‘||pename||‘--‘||pjob||‘--‘||psal);

end;

/

    

public class TestCallOracleFunc {

    public static void main(String[] args) throws Exception{

        String sql = "{?=call findEmpNameAndJobAndSal(?,?,?)}";

        Connection conn = JdbcUtil.getConnection();

        CallableStatement cstmt = conn.prepareCall(sql);

        cstmt.registerOutParameter(1,Types.VARCHAR);

        cstmt.setInt(2,7788);

        cstmt.registerOutParameter(3,Types.VARCHAR);

        cstmt.registerOutParameter(4,Types.INTEGER);

        cstmt.execute();

        String ename = cstmt.getString(1);

        String job = cstmt.getString(3);

        Integer sal = cstmt.getInt(4);

        System.out.println(ename+":"+job+":"+sal);

        JdbcUtil.close(cstmt);

        JdbcUtil.close(conn);

    }

}

js day03

标签:prepare   ror   except   处理   cin   接收   lse   方式   1.0   

原文地址:https://www.cnblogs.com/wahahshield/p/9120086.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!