jQuery事件

88 阅读1分钟

mouseenter事件与mouseleave事件

mouseenter mouseleave ★在进入子元素区域的时候不会触发

mouseover和 mouseout 在进入子元素区域的时候也会触发

hover 由mouseenter和mouseleave组成 同样在进入子元素区域的时候不会触发

键盘事件

 用户名:<input type="text" name="" id="">
    密码:<input type="password" name="" id="">
    <script src="./jquery-1.12.4.js"></script>
    <script>

按下键盘时

$('input[type=text]').keydown(function(){
    //     alert('我按下了')

释放按键时

$('input[type=password]').keyup(function(){
    //     alert('鼠标抬起了') 
    

产生可打印的字符时 连续敲击键盘的时候触发

  $('input[type=password]').keypress(function(){
    //     alert('连续敲击键盘')
    
    
   $(document).keyup(function(e){
        /* 敲击回车的时候触发 */
        if(e.keyCode==13){
            alert('我提交了')
        }
    })
    

scrollLeft([position]) 参数可选。设置或返回匹配元素相对滚动条左侧的偏移

scrollTop([position]) 参数可选。设置或返回匹配元素相对滚动条顶部的偏移

设置滚动条的距离 */
    // $(window).scrollLeft(600)
    /* 获取滚动条的距离 */
    // console.log( $(window).scrollLeft() )
    jq提供的监听滚动条事件 */
    // $(document).scroll(function(){
    //     console.log( $(document).scrollTop() )
    // })
    

position( ) 返回第一个匹配元素相对于父元素的位置

offsetParent 返回最近的已定位祖先元素

定位元素指的是元素的CSS position值被设置为relative、absolute或fixed的元素 *

width height获取的只是content里面的距离,不包括padding margin border

 // let w = $('div').width()
    // let h = $('div').height()
    // console.log(w);
    // console.log(h);
    /* 返回以像素为单位的top和left坐标。仅对可见元素有效 */
    /* ★top 和 left值会包括自己的margin值和父元素的border值 */
    // console.log( $('.div2').offset().top );
    // console.log( $('.div2').offset() );