Jquery学习总结









Insert title here





function fn1(){

//get异步访问

$.get(

"/WEB22/ajaxServlet2", //url地址

{"name":"张三","age":25}, //请求参数

function(data){ //执行成功后的回调函数

//{\"name\":\"tom\",\"age\":21}

alert(data.name);

},

"json"

);

}

function fn2(){

//post异步访问

$.post(

"/WEB22/ajaxServlet2", //url地址

{"name":"李四","age":25}, //请求参数

function(data){ //执行成功后的回调函数

alert(data.name);

},

"json"

);

}

function fn3(){

$.ajax({

url:"/WEB22/ajaxServlet2",//跳转的地址

async:true, //true时,为异步,false为同步

type:"POST",//提交的方式

data:{"name":"lucy","age":18},//提交的数据

success:function(data){//成功返回后执行的人函数

alert(data.name);

},

error:function(){//失败时执行的函数

alert("请求失败");

},

dataType:"json"//返回值的类型

});

}












总结:

jq语句自然想要导入包,$.get()/$.post()/$.ajax({})   每个单元用逗号隔开,最后都要加上一个分号作为结束符号 -->

 

 

 

 

 

 

 

 

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>











  • 登录
  • 注册
  • 购物车
  • 我的订单
  • Toggle navigation 首页
    手机数码(current)
  • 电脑办公
  • 电脑办公
  • 电脑办公
  • Submit function overFn(obj){ $(obj).css("background","#DBEAF9"); } function outFn(obj){ $(obj).css("background","#fff"); } function clickFn(obj){ $("#search").val($(obj).HTML()); $("#showDiv").css("display","none"); } function searchWord(obj){ //1、获得输入框的输入的内容 var word = $(obj).val(); //2、根据输入框的内容去数据库中模糊查询---List var content = ""; $.post( "${pageContext.request.contextPath}/searchWord", {"word":word}, function(data){ //3、将返回的商品的名称 现在showDiv中 //[{"pid":"1","pname":"小米 4c 官方版","market_price":8999.0,"shop_price":8999.0,"pimage":"products/1/c_0033.jpg","pdate":"2016-08-14","is_hot":1,"pdesc":"小米 4c 标准版 全网通 白色 移动联通电信4G手机 双卡双待 官方好好","pflag":0,"cid":"1"}] if(data.length>0){ for(var i=0;i"; } $("#showDiv").html(content); $("#showDiv").css("display","block"); } }, "json" ); }

     总结:

    click 是关键字所以不能把方法名取名为click  $(变量名)、$("选择器取得名字")

        $().css();给标签添加样式、  ("样式","样式值")       通过jq改变标签的样式

        $().HTML();给标签添加内容(内容可以写成字符串的样子传入)   改变或增加标签的内容   增加标签

        $().val();获取标签的值(input)

        $().事件(function(){});获取标签的值(input)    页面加载特殊($(function())

        $(obj).html()获取标签的内容(盒子div中的文字)

        //通过jq改变标签的样式,改变标签的内容。增加标签

     

    content+="

    "+data[i]+"
    ";

    //这里的this表示该div(为什么不给div取一个名字然后直接通过ID获取这个div?)因为这个方法可以表示n个这样的方法,而且这里也只能这样做

    如何通过 jquery 给HTML添加标签   

    1. 定义一个字符串变量
    2. 把要HTML标签写成字符串的形式,原来的“”的地方变成‘’。遇到变量用“+变量+”表示
    3. $("#showDiv").html(content)把字符串变量放入到某个标签的HTML中

     

     

     

     

     

     


     

    <%@ page language="java" contentType="text/html; charset=UTF-8"
    
    pageEncoding="UTF-8"%>
    
    
    
    
    
    
    
    
    
    会员注册
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    $(function(){
    
    
    
    //为输入框绑定事件
    
    $("#username").blur(function(){
    
    //1、失去焦点获得输入框的内容
    
    var usernameInput = $(this).val();
    
    //2、去服务端校验该用户名是否存在---ajax
    
    $.post(
    
    "${pageContext.request.contextPath}/checkUsername",
    
    {"username":usernameInput},
    
    function(data){
    
    var isExist = data.isExist;
    
    //3、根据返回的isExist动态的显示信息
    
    var usernameInfo = "";
    
    if(isExist){
    
    //该用户存在
    
    usernameInfo = "该用户名已经存在";
    
    $("#usernameInfo").css("color","red");
    
    }else{
    
    usernameInfo = "该用户可以使用"
    
    $("#usernameInfo").css("color","green");
    
    }
    
    $("#usernameInfo").html(usernameInfo);
    
    
    
    },
    
    "json"
    
    );
    
    });
    
    });
    
    
    
    //总结: //每个事件();   以;结束  
    
    //变量出现了问题是不会提示出错的  $("#username")如果没有写#就不会提示出错
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    会员注册USER REGISTER
    
    
    
    
    
    用户名
    
    
    
    
    
    
    
    
    
    
    
    
    
    密码
    
    
    
    
    
    
    
    
    
    
    
    确认密码
    
    
    
    
    
    
    
    
    
    
    
    Email
    
    
    
    
    
    
    
    
    
    
    
    姓名
    
    
    
    
    
    
    
    
    
    
    
    性别
    
    
    
     
    
    男
    
      
    
    出生日期
    
    
    
    
    
    
    
    
    
    
    
    
    
    验证码
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    

     

    总结:

    定义方法有两种:

    第一种:在页面加载的时候 获取标签 通过标签.事件的方法进行加载

    $(function(){

    //为输入框绑定事件

    $("#username").blur(function(){

    2.一种是把事件写在HTML标签中

     

     

     

    其实很多的功能不使用json 也可以  ,但是使用ajax最大的好处就是 异步访问  可以使加载事件更加的快

    所以以后凡是事件中要向后台要数据都可以使用ajax技术来实

     

     

    //这里的this表示该div(为什么不给div取一个名字然后直接通过ID获取这个div?)因为这个方法可以表示n个这样的方法,而且这里也只能这样做

    如何通过 jquery 给HTML添加标签   

    1. 定义一个字符串变量
    2. 把要HTML标签写成字符串的形式,原来的“”的地方变成‘’。遇到变量用“+变量+”表示
    3. $("#showDiv").html(content)把字符串变量放入到某个标签的HTML中

     

    你可能感兴趣的:(前端)