zoukankan      html  css  js  c++  java
  • jquery 问题

    detach():这个方法不会把匹配的元素从jQuery对象中删除,因而可以在将来再使用这些匹配的元素。与remove()不同的是,所有绑定的事件、附加的数据等都会保留下来。

     

    jquery ajax不能下载文件 

    jquery 使用$.cookie:需要引入jquery.cookie.js;

    不能多次引入jquery.js

    场景:polymer paper-button选中,元素添加active属性;如何判断元素是否被active:$('#').attr('active') ===undefined,说明没有被active

    选择有active属性的元素$('div[active]');

    jquery 同时绑定click和dblclick,dblclick时也会触发click:http://www.cnblogs.com/huangjacky/archive/2012/09/27/2706110.html

    var _time = null;
    $(this).find("tr").dblclick(function(e){
        clearTimeout(_time);
        console.log("dblclick");
        //真正双击代码
    
    }).click(function(e){
        clearTimeout(_time);
        _time = setTimeout(function(){
            console.log("click");
            //单击事件在这里
    
        }, 300);
    });
    

      

    jquery插件判断方法

    if(!window.jQuery) {
      alert("Could not find jQuery! The HTML must include jquery.js before opencpu.js!")
    }
    

    jquery 操作 checkbox

    国内很多技术博客太坑了,jquery选中或取消checkbox,竟然全都写错了,都用attr('', true/'checked');你们也不自己多点几次,能行得通吗?

    或许是我用的jquery版本不同,我用的1.11.3

    $('').prop('checked', true);  $('').prop('checked', false); 

    jquery 操作 radio

    $('input[name="color_pal"][value="sfp"]').prop('checked', true);
    

      

    jquery hover:这个方法挺好用的,如果需要hover 和 no hover有不同的事件时,可以用它来实现

    $('').hover(function(){}, function(){}) 

    jquery .stop();

    停止当前元素上运行的动画

    需要的场景:mouse over 执行一个动画;如果很快over5次,会执行5次动画;如果使用了.stop(), 则在动画执行期间不会监听到over事件

    jquery对象与dom对象

    DOM对象:var dom = document.getElementById('#id'); 方法:dom.innerHTML;

    jQuery对象:var jquery = $('#id'); 方法:jquery.html()

    jquery对象转为dom对象:[0] get(0)

    dom对象转为jquery对象:$(dom)

    click <a>

    问题场景:需要js触发<a>的click()事件,使用jquery对象一直没有成功的触发:$('#test').click()

    解决办法:把jquery对象转为dom对象,$('#test')[0].click();  $('#test').get(0).click(); 这里相当于调用了dom的click()方法

    使用jquery插件dotdotdot

    $(".test").dotdotdot({
      wrap: 'letter'
    });
    // 英文的话,wrap是Word和letter都可以,如果是中文的话,wrap只能是letter
    

    animate延迟实现
    错误的写法

    setTimeout(function(){
        $(this).animate({top: '0'}, 400, 'linear', function(){
            console.log('debug2');
        })
    }, 200)
    

    正确的写法

    setTimeout(function(){
        $('#test').animate({top: '0'}, 400, 'linear', function(){
            console.log('debug2');
        })
    }, 200)    
    

    原因:setTimeout会改变上下文环境,导致this指向有问题

    不是接受键盘事件,而是模拟键盘操作

    触发keydown事件

    jQuery(function($){
    
    $(window).keydown(function(e){
    
    if(e.keyCode==13){
      e.preventDefault();
      alert("按下了enter`````");
    }
    
    });
    
    function simulateKeyPress(character){
    
    var e = jQuery.Event("keydown");
    e.keyCode=character;
    $(window).trigger(e);
    
    };
    
    
    $('#submit').on('click', function(){
    
    simulateKeyPress(13);
    
    })
    

      

    jquery mobile

    input click后,出现蓝色的边框

    input:focus { outline: none; } 可消除。

    今天碰到一个js的加载问题。

    描述:<script>引入jquery,再引入opencpu。如果opencpu先加载完成,就会开始执行,如果没找到jquery,就会提示报错;否则,执行setURL()

    解决办法:加载顺序,常用require,但是这里用的比较简单,感觉没必要。

    1、加载完jquery,再通过js动态加载opencpu。这种方法,自己写的动态加载的函数没有回调,没法在opencpu加载完,执行setURL。

    2、jquery ajax getScript(),可以弥补1的不足。

    jQuery.ajax({
        url: "jquery.cookie.js",    // 可以缓存脚本
        dataType: "script",
        cache: true
    }).done(function() {
        jQuery.cookie("cookie_name", "value", { expires: 7 });
    });
    

     

    jsonp用法:只支持get 不支持post

    $.ajax({
            type: 'POST',
            url: "http://localhost:3050/test",
            data: {
              "Email": "asda@qeq.com",
              "Password": "123456"
            },
            dataType: "jsonp",
            success: function(data){
              debugger
            }
          })
    

    跨域 需要在服务器端添加Access-Control-Allow-origin:*  

     

    当调整浏览器窗口大小时,触发resize时间;而内容高度变化时,不会触发resize事件

    innerHeight() 就是scrollHeight

    jquery easing

    需要添加ui.css ui.js才可以用缓动函数;常用的缓动函数,可以从官网查找:http://jqueryui.com/easing/

    fullpage.js 开发时,把所有的内容都放在div,然后div居中就好。

    .stop()的一个问题

    代码如下

    $('.page-6 .list .item').mouseenter(function(){
        var that = this;
        $(this).find('.img-wrap').stop(true).fadeOut(200, function(){
          $(that).find('.text-wrap').stop(true).fadeIn(200, function(){
          });
        });
      })
    
      $('.page-6 .list .item').mouseleave(function(){
        var that = this;
        $(this).find('.text-wrap').stop(true).fadeOut(200, function(){
          $(that).find('.img-wrap').stop(true).fadeIn(200, function(){
          });
        });
      })
    

    如果使用jquery-1.7.2.js 当在200ms内,leave元素时,相关元素不会回到最初状态;如果使用jquery-2.1.4.js 当在200ms内,leave元素时,相关元素会回到最初状态,这才是理想的情况。

    innerHeight() 包括padding

      

  • 相关阅读:
    随笔35 内联函数
    随笔32 内部类,外部类,局部内部类
    随笔31 Spring的依赖注入的三种方式
    随笔30 抽象类与接口
    随笔29 Statement对象
    随笔28 Spring中的事务
    随笔27 面向对象的五大基本原则
    随笔26 java中的泛型
    html5学习笔记——HTML5 web存储
    html5学习笔记——HTML 5 视频
  • 原文地址:https://www.cnblogs.com/wang-jing/p/4237611.html
Copyright © 2011-2022 走看看