zoukankan      html  css  js  c++  java
  • jquery 学习笔记

    索引
    1.checkbox相关操作
    2.js强制按数字计算
    3.jquery将字符串转换为json对象
    4.jquery获取选中radio值
    5.jquery简单的奇偶行变色
    6.jquery获取radio选中值
    7.js操作json集合
    8.jquery彻底清除dom元素
    9.jquery延迟mouseover,mouseout事件
    10.iframe中调用父窗口js方法
    11.jquery点击行选中checkbox
    12.jquery ajax 从后台获取 数字 前台 显示空
    13.jquery 去掉内容左右的空格
    14.字符串转json对象
    15.jquery.cookie插件相关操作

    1.checkbox相关操作
    jquery判断checkbox选中个数,如果大于五个,不能选
    就这一小段代码花了我三个小时......

      var inputs = $("#checkboxTd input[name='profession']");
    inputs.bind("click",function(){
    if($("#checkboxTd input:checked").length>5){
    $(this).removeAttr("checked");
    }
    });
    作用是name为profession的checkbox最多能选择五个
    新版的jquery,判断checkbox选中和取消选中时,使用:$('#id').prop('checked')==true表示选中
    全选和取消全选操作,使用$("input[type='checkbox']").prop("checked",$("#id").prop("checked"));

    2.js 强制按数字计算
    var a = "1";
    var b = "2";
    alert(a+b);// 输出"12"
    alert((+a)+(+b));// 输出"3"

    3.jquery将字符串转换为json对象
    var d = $.parseJSON(data); // 需要注意的是,data的格式必须为{"key":"value","type":"1"}

    4.jquery获取选中radio值
    var row = $(":radio[checked='true']").val();

    5.jquery简单的奇偶行变色
    $("#tab_new tr:even").css("background-color","#fafafb");// tab_new 表格tbody的id

    6.jquery获取radio选中值
    var radio = $(":radio:checked").val();// 这种更简单些

    7.js操作json集合
    data.pop(); //移除最后一个元素并返回该元素值 
    data.shift(); //移除最前一个元素并返回该元素值,数组中元素自动前移 
    data.splice(deletePos,deleteCount); //删除从指定位置deletePos开始的指定数量deleteCount的元素,数组形式返回所移除的元素 

    8.jquery彻底清除dom元素
    function clean(id){
    	$.each($("#"+id).children(),function(){
    		$.event.remove(this);// 清除绑定的事件
    		$.removeData(this);// 清除jquerydata
    	});
    	$("#"+id).empty();// 清空子元素
    }

    9.jquery延迟mouseover,mouseout事件
    jQuery(document).ready(function($) {
        var delayTime = [];
        jQuery('li.mainlevel').each(function(index) {
            $(this).hover(function() {
                var _self = this;
                delayTime[index] = setTimeout(function() {
                    $(_self).find('ul:eq(0)').slideDown(200)
                },
                400)
            },
            function() {
                clearTimeout(delayTime[index]);
                $('ul', this).slideUp(200)
            })
        });
    });

    10.iframe中调用父窗口js方法
    window.parent.function();

    11.jquery点击行选中checkbox

    var row = {
    	rowClick:function(table,checkboxName){
    		$("#"+table).find("tr td").click(function(){
    			var cbk = $(this).parent().find("input[name='"+checkboxName+"']");
    			if(cbk.data("cbk")==0){
    				cbk.data("cbk",1);
    				cbk.attr("checked",false);
    			}else{
    				cbk.data("cbk",0);
    				cbk.attr("checked",true);
    			}
    		});
    	}
    };
    调用时,直接使用row.rowClick("tbodyName","checkboxName");

    12.jquery ajax 从后台获取 数字 前台 显示空
      很奇怪的问题,明明从后台获取到的是一个数字,在前台alert()这个数字的时候,竟然是""

    response.getWriter().write(projectService.checkProjectNumber(projectNumber));// 写一个数字到前台
    response.getWriter().write(projectService.checkProjectNumber(projectNumber)+"");// 写一个字符串到前台,用这个可以,把数字转换为字符串

    13.jquery 去掉内容左右的空格
      

    $(function(){
      $("input,textarea").blur(function(){
        $(this).val($.trim($(this).val())); // $.trim(str);去掉str空格
      });
    });// 这段代码意思是,给所有的input和文本域加上焦点离开事件,焦点离开时,去掉文本框内容两边的空格

    14.字符串转json对象

    JSON.parse(data);

    15.jquery.cookie插件相关操作

    $.cookie("user","xxxxxxxx", {expires:7, path:"/"});//设置cookie,7天过期
    $.cookie("user");// 获取设置的cookie
    $.cookie("user",null, {path:"/"});// 清除cookie
    

      




    jquery 相关其他文章:jquery 选择器

  • 相关阅读:
    Ajax学习总结
    从零开始学Docker
    IBM Websphere MQ常用命令及常见错误
    Log4j学习总结
    Eclipse中各图标含义
    类加载机制与反射
    Feign【入门】
    Eureka【故障演练分析】
    Eureka【启用https】
    Eureka【开启http basic权限认证】
  • 原文地址:https://www.cnblogs.com/zhouyalei/p/2264700.html
Copyright © 2011-2022 走看看