【JavaWeb】jQuery函数绑定方式（附示例代码）

1、 jQuery 函数绑定方式一，其中该方式可以使用js中大部分事件类型 比如click，mouseenter，mouseleave，mouseup，mousedown，dblclick。。。

特别注意，jquery自行封装了一个hover事件,【为已知元素绑定事件】

  $(".ghx").click(function() {//绑定一个类名为"ghx"的对象的点击事件

        alert(1)

    })

   $(".ghx").hover(function(e) {//绑定一个类名为"ghx"的对象的悬停事件

        console.log(111)

    })

2、jQuery 函数绑定方式二，其中该方式可以使用js中大部分事件类型 比如click，mouseenter，mouseleave，mouseup，mousedown，dblclick.......

 特别注意，不能使用hover,【为已知元素和未来元素绑定事件】           

 $(".ghx").on(evenType, function() {//even可以为click等方法

     alert(111)

 })

补充

1、.click(): 绑定点击事件。

$("#myButton").click(function() {
  // 在点击#myButton元素时执行的代码
});

2、.on(): 绑定任意类型的事件。可以用于动态绑定事件，适用于后来添加的元素。

$("#myButton").on("click", function() {
  // 在点击#myButton元素时执行的代码
});

3、.hover(): 绑定鼠标悬停和离开事件。

$("#myElement").hover(
  function() {
    // 鼠标悬停在#myElement元素上时执行的代码
  },
  function() {
    // 鼠标离开#myElement元素时执行的代码
  }
);

4、.focus(): 绑定获得焦点事件。

$("#myInput").focus(function() {
  // 当#myInput元素获得焦点时执行的代码
});

5、.blur(): 绑定失去焦点事件。

$("#myInput").focus(function() {
  // 当#myInput元素获得焦点时执行的代码
});

6、.change(): 绑定输入字段值改变事件。

$("#myInput").change(function() {
  // 当#myInput元素的值发生改变时执行的代码
});

7、.submit(): 绑定表单提交事件。

$("#myForm").submit(function(event) {
  // 在#myForm提交时执行的代码
  event.preventDefault(); // 阻止表单默认提交行为
});