jQuery是为了事件处理特别设计的
【1】jQuery名称冲突
jQuery使用$作为jquery的简介方式
jQuery使用名为noConflic()来修改名称:var gx=$.noConflict();
【2】jQuery事件:
1. $(document).ready(function(){});将函数绑定到文档的就绪事件中;(当文档完成加载时)
2. $(selector).click(function(){})触发或将函数绑定到被选元素的单击事件
3. $(selector).dbclick(function(){});触发或将函数绑定到被选元素的双击事件
4. $(selector).focus(function(){});触发或将函数绑定到被选元素的获取焦点事件
5. $(selector).mouseover(function(){})触发或将函数绑定到被选元素的鼠标悬停事件
6.jquery事件绑定bind()方法
bind方法为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数
语法:
$("selector").bind(event,data,function)
event必须规定添加到元素的一个或多个事件
data可选规定传递到函数额外的参数
function必选规定到事件发生时的运行函数
$("button").bind("click",function(){
$("p").slideToggle();
});
slideToggle通过使用滑动效果,在显示和隐藏状态之间切换 <p> 元素:
替代语法:
$(selector).bind({event:function, event:function, ...})
$("button").bind({
click:function(){$("p").slideToggle();},
mouseover:function(){$("body").css("background-color","red");},
mouseout:function(){$("body").css("background-color","#FFFFFF");}
});
jQuery失去焦点---flur()方法
jQuery获取焦点---focus()方法
jQuery事件---change()方法
当元素的值发生改变时会触发change()事件
该事件仅仅适用于文本域(text field),以及textarea和select
change()函数触发change事件,或规定当发生change时运行的函数
eg:
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".field").change(function(){
$(this).css("background-color","#FFFFCC");
});
});
</script>
</head>
<body>
<p>在某个域被使用或改变时,它会改变颜色。</p>
Enter your name: <input class="field" type="text" />
<p>Car:
<select class="field" name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</p>
</body>
</html>
jQuery事件----click()点击事件
jQuery事件----dbclick()双击事件
jQuery事件----delegate()方法 为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序
$(selector).delegate(childSelector,event,data,function)
childSelector必须
event必须
function必须
jQuery事件---die()
移除所有通过live()方法添加的事件处理程序
$(selector).die(event,function)
event必须规定要移除一个或多个事件处理程序
jQuery 事件 - error() 方法
$("img").error(function(){
$(img).replaceWith("Missing image!");
});