jQuery的几个例子流程讲解

·select框子
获取id为checkAll添加点击事件,时间内改变所有:checkbox的属性checked为true;
获取id为checkNo添加点击事件,事件内改变所有:checkbox的属性checked为false;
获取id为checkAga添加点击事件,事件内利用each()事件遍历:checkbox【name=items】的条目,改变checked属性为!(this)》attr(“checked”);


·精简显示列表
首先控制显示索引大于2并且除去最后一个条目的li标签隐藏;
给“显示全部品牌”<span>添加toggle事件,第一个函数让所有li.show()显示,并且改变span的text(“精简显示”);
第二个函数重复隐藏大于2并且除去最后一个条目的所有li,并且给span标签重新text(“显示全部品牌”);

·选项卡
首先给li标签添加mouseenter鼠标移入事件,获取this并且添加属性(被选中的类),同时siblings(li).removeClass("被选中的类名"),从而控制只让被选中的li变色
第二步控制内容显示框的所有子元素children().eq($(li).index(this)).fadeIn(),并且让所有的siblings().hide().

·表单验证
获取所有类名为require的input标签添加一个strong标签内加一颗星星!
第二步当所选元素失去焦点是添加一个blur事件;
第三在blur事件函数内判断当$(this).is("#username")时进行用户名验证;当$(this).is("#email")时进行email验证;
在用户名验证时,判断this.value.length<6时 给选中元素的父元素添加一个错误提示文字的span标签,反之亦然;
在邮件验证时首先根据创建span标签时所创建的class属性清空span标签,然后创建一个reg验证变量,调用reg的test()方法验证选中的$email.val().当验证值为false的时候创建错误提示span标签并添加到当前选中元素的父元素!反之亦然!

posted @ 2013-04-02 13:47  xinyuyuanm  阅读(114)  评论(0编辑  收藏  举报