.bind ( ) 添加事件
$(selector).bind(event,data,function);
| 参数 |
描述 |
| event |
必需。规定添加到元素的一个或多个事件。
由空格分隔多个事件。必须是有效的事件。 |
| data |
可选。规定传递到函数的额外数据。 |
| function |
必需。规定当事件发生时运行的函数。 |
例
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").bind("click",function(){
$("p").slideToggle();
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button>请点击这里</button>
</body>
</html>
$(selector).bind({event:function, event:function, ...});
| 参数 |
描述 |
| {event:function, event:function, ...} |
必需。规定事件映射，其中包含一个或多个添加到元素的事件，以及当事件发生时运行的函数。 |
例
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").bind({
click:function(){$("p").slideToggle();},
mouseover:function(){$("body").css("background-color","red");},
mouseout:function(){$("body").css("background-color","#FFFFFF");}
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button>请点击这里</button>
</body>
</html>
.unbind( ) 取消事件事件
$(selector).unbind(event,function);
| 参数 |
描述 |
| event |
可选。规定删除元素的一个或多个事件
由空格分隔多个事件值。
如果只规定了该参数，则会删除绑定到指定事件的所有函数。 |
| function |
可选。规定从元素的指定事件取消绑定的函数名。 |
例
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p").click(function(){
$(this).slideToggle();
});
$("button").click(function(){
$("p").unbind();
});
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<p>这是另一个段落。</p>
<p>点击任何段落可以令其消失。包括本段落。</p>
<button>删除 p 元素的事件处理器</button>
</body>
</html>
$(selector).unbind(eventObj)
| 参数 |
描述 |
| eventObj |
可选。规定要使用的事件对象。这个 eventObj 参数来自事件绑定函数。 |
例
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var x=0;
$("p").click(function(e){
$("p").animate({fontSize:"+=5px"});
x++;
if (x>=2)
{
$(this).unbind(e);
}
});
});
</script>
</head>
<body>
<p style="font-size:20px;">点击这个段落可以增加其大小。只能增加两次。</p>
</body>
</html>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。
