一、jQuery事件
注意：JavaScript事件和jQuery事件是不同的
| 事件 | 事件绑定 |
|---|---|
| $(selector).dblclick(function) | 触发或将函数绑定到被选元素的点击事件 |
| $(selector).dblclick(function) | 触发或将函数绑定到被选元素的双击事件 |
| $(selector).mouseover(function) | 触发或将函数绑定到被选元素的鼠标悬停事件 |
| $(selector).mouseleave(function) | 触发或将函数绑定到被选元素的鼠标离开事件 |
| $(selector).keyup(function) | 触发或将函数绑定到被选元素的键盘键被松开事件 |
代码演示
-
源代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-1.10.2.min.js"></script>
<script>
//加载
$(function () {
//鼠标悬浮
$('input').mouseover(function () {
//鼠标悬浮隐藏p元素
$('p').hide();
})
//鼠标离开
$('input').mouseleave(function () {
//鼠标离开显示p元素
$('p').show();
})
})
</script>
</head>
<body>
<input type="button" value="点我隐藏">
<p class="cla1">
这是内容
</p>
</body>
</html>- 运行结果
二、jQuery设置与获取HTML
1、演示text()的用法
-
text()获取值
代码演示：
- 运行结果
-
text()修改值
代码演示：
- 运行结果
2、演示html()的用法
-
html()获取值
-
html()修改值
代码演示：
- 先演示text()修改值
- 运行结果
- 再演示html()修改值的效果（html()修改值时添加标签，也就是重新设置HTML元素）
- 运行结果
3、演示val()的用法
代码演示：
- 运行结果
