jq注册事件

1.jq对象.on('事件名',事件处理函数）

$('p').on('click',function(){
  console.log('on注册的事件')
})

2.（1）父元素.on('事件名','子元素',事件处理函数）

   $('button').click(function(){
      $(' <p>创建的p元素</p>').appendTo('.box')
    })

$('.box').on('click','p',function(){
  console.log('on注册的事件委托')
})

（2）.e.stopPropagation() 阻止事件冒泡

   $('.box').on('click', function () {
        console.log('父级元素本身的点击事件')
      })
      $('.box').on('click', 'p', function (e) {
        console.log('on注册的事件委托')
        e.stopPropagation()
      })

 

 3..off()  事件解绑

（1）.jq对象.off()    解绑所有事件

   $('button').click(function () {
        $('.box').off()
      })

      $('.box').on('click', function () {
        console.log('父级元素本身的点击事件')
      })
      $('.box').on('click', 'p', function (e) {
        console.log('on注册的事件委托')
        e.stopPropagation()
      })

（2）父元素.off("事件名"，"子元素")   解绑子元素的 指定事件

     $('button').click(function () {
        $('div').off('click','p')
      })

      $('.box').on('click', function () {
        console.log('父级元素本身的点击事件')
      })
      $('.box').on('click', 'p', function (e) {
        console.log('on注册的事件委托')
        e.stopPropagation()
      })
      $('.box').on('mouseenter', 'p', function (e) {
        console.log('on注册的事件委托')
        e.stopPropagation()
      })

（3）jq对象.off('事件名')   解绑指定事件

      $('button').click(function () {
        $('p').off('click')
      })
      $('p').on('click', function (e) {
        console.log('on注册的事件委托')
       
      })
      $('p').on('mouseenter',function (e) {
        console.log('on注册的事件委托')
      })

4.触发事件   jq对象.click()   

  $('div').on('click',function(){
    console.log('div的点击事件')
  })
$('button').on('click',function(){
  $('div').click()
})

 5. return false 在jq中的作用

 $('a').on('click',function(e){
    console.log('a的点击事件')
    // e.stopPropagation()   //阻止事件冒泡
    // e.preventDefault()    //阻止浏览器的默认行为
    return false;            //阻止浏览器的默认行为和阻止事件冒泡
  })
  $('.box').on('click',function(){
    console.log('box的点击事件')
  })