<!DOCTYPE html>
<html>
<head>
<script src="../jQuery 1.3.2/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function(){
$('#div1').bind('click', function(){
$('body').removeClass('large');
$('body').removeClass('small');
});
$('#div2').bind('click', function(){
$('body').addClass('large');
$('body').removeClass('small');
});
$('#div3').bind('click', function(){
$('body').addClass('small');
$('body').removeClass('large');
});
});
</script>
<style type="text/css">
#div1 {
background-color: #33FFFF;
height: 100px;
width: 100px;
}
#div2 {
background-color: #33FF00;
height: 100px;
width: 100px;
}
#div3 {
background-color: #3300FF;
height: 100px;
width: 100px;
}
body{ font-size: 12px; font-family: Arial; }
.large{
font-size:20px;
}
.small{
font-size:36px;
}
</style>
</head>
<body>
<div id="div1" class="mydiv"></div>
<div id="div2" class="mydiv"></div>
<div id="div3" class="mydiv"></div>
<div><p>dfjdlfjdlfl</p></div>
</body>
</html>
.bind()用法
点击三个颜色块,触发事件可以改变字体的大小格式等。。。。
分享到:
相关推荐
`bind()`是jQuery中用于绑定事件处理函数的核心方法,对于初学者来说,掌握这个方法是理解jQuery事件处理的关键。 `bind()`方法的基本语法如标题和描述中所述:`bind(type, [data], fn)`。这里,`type`是一个或多个...
jQuery QueryLoader2是一款强大的JavaScript库,专为网页中的图片加载设计出优雅的加载动画效果。这个库是由Gerben Stoel开发的,它旨在提供一种跨浏览器的解决方案,以提升用户体验,尤其是在网页内容加载期间。...
首先,我们来介绍最基本的事件绑定方法——`bind()`。`bind()`方法能够为所有匹配的元素的特定事件绑定事件处理函数。例如: ```javascript $('#clickme').bind("click", function() { alert("HelloWorldbind"); }...
到了jQuery 1.7,`.on()`方法替代了`.bind()`, `.delegate()`, 和`.live()`,成为统一的事件绑定接口,提供了更高的灵活性和性能优化。`.off()`方法用于移除事件绑定,进一步完善了事件处理的管理。同时,这个版本还...
1、在DOM对象的实践操作中,既然存在用于绑定事件的bind方法,也相应存在用于移出绑定事件的方法,在JQuery中,可以通过unbind方法移除所有绑定的事件或某一个事件。 2、示例代码: 代码如下:<!DOCTYPE ...
bind()————————-版本号小于3.0(在Jquery3.0中已经移除,相应unbind()也移除) live()————————–版本号小于1.7(在Jquery1.7中已经移除,相应die()也移除) delegate()——————-版本号小于1.7...
1.7版本引入了一个重要的特性——jQuery.fn.on(),这是一个全新的事件绑定函数,替代了之前常用的`.bind()`, `.live()`, 和 `.delegate()`。`.on()`方法允许更灵活的事件处理,可以一次性绑定多个事件类型,并且支持...
《jQuery API 中文版》包含了丰富的JavaScript库——jQuery的核心功能及扩展插件的详细文档,是开发者学习和查阅jQuery相关知识的重要参考资料。本资源包含了两个版本的jQuery API文档:一个是针对jQuery 1.7.2的...
这个压缩包文件"网页模板——基于jQuery仿ios5 通知中心弹出振动插件效果.zip"包含了实现这种效果所需的资源和代码,帮助网页设计师和开发者在他们的项目中轻松集成这一功能。 首先,我们要理解jQuery库在其中的...
**jQuery Treeview插件——jsontree解析及应用** `jQuery Treeview` 是一个非常流行的JavaScript库,用于将HTML表格或无序列表转换为可交互的树状视图。在这个特定的版本——`jsontree`,它进一步扩展了功能,能够...
首先,我们需要了解jQuery的核心思想——"Write Less, Do More",即用更少的代码实现更多的功能。在jQuery Hotkeys插件中,这一理念得到了充分的体现。通过引入"jquery-1.4.1.min.js",我们获得了基础的jQuery功能,...
jQuery 1.7版本带来了重要的改变——jQuery.fn.on()方法,替代了之前的.live(), .bind(), .delegate()等事件绑定方式。.on()方法更加灵活,支持事件委托,可以绑定到当前及未来元素,增强了事件处理的效率和适应性。...
这份资料——"jQueryAPI-100204",旨在全面介绍jQuery的基础知识,帮助开发者快速掌握并运用jQuery。 1. **jQuery选择器**:jQuery的选择器功能强大,能够快速定位到HTML元素,如`$()`函数用于选择元素,CSS选择器...
这个版本引入了一个重要的特性——`on()`和`off()`方法,这两个方法取代了之前的`bind()`, `live()`, `delegate()`和`undelegate()`,提供了更灵活和高效的事件处理。`on()`方法允许事件处理程序绑定到当前或未来的...
1. **引入jQuery库**:在HTML文件中,我们需引入jQuery库,这里提供了两个版本的jQuery文件——jquery-1.2.6.js和jquery-1.3.2.min.js。选择任意一个添加到页面头部,例如: ```html <script src="jquery-1.3.2....
——jQuery中文用户组 jQuery因为易于使用和功能强大著称,是所有Web开发者应该掌握的一种利器,初学者如何才能快速而有效地掌握jQuery呢?最好的方法莫过于一边学习理论,一边动手实践这些理论,本书就是按照这种...
jQuery 是一款非常流行的 JavaScript 库,由 John Resig 创建,它以其简洁高效的设计理念——“WRITE LESS, DO MORE”而受到广泛赞誉。jQuery 的目标是简化 JavaScript 开发,使得开发者可以更轻松地处理 HTML 文档...
在JQuery中,我们可以使用`.bind()`方法结合对象字面量来实现这一功能。 2. 示例代码详解: 以下是一个简单的例子,展示了如何使用映射方式给一个文本框(`<input type="text" class="txt" />`)同时绑定`focus`和`...